标签：
While you have multiple streams flowing into your scan operator, you‘ll need to map each stream to the specific values you need to update your state the way that you want. This lesson covers using the map operator to determine what the click and interval should do when the state is updated.
import {Component} from ‘angular2/core‘;
import {bootstrap} from ‘angular2/platform/browser‘;
import {Observable} from ‘rxjs/Observable‘;
import ‘rxjs/add/observable/interval‘;
import ‘rxjs/add/observable/merge‘;
import ‘rxjs/add/operator/map‘;
import ‘rxjs/add/operator/scan‘;
import ‘rxjs/add/operator/startWith‘;
import {Subject} from ‘rxjs/Subject‘;
@Component({
selector: ‘app‘,
template: `
<button (click)="click$.next()">Add one second</button>
<h1>{{clock | async | date: ‘yMMMMEEEEdjms‘}}</h1>
`
})
class App {
click$ = new Subject();
clock;
constructor(){
this.clock = Observable.merge(
Observable.interval(1000).mapTo(‘second‘),
this.click$.mapTo(‘hour‘)
)
.startWith(new Date())
.scan( (acc: Date, curr: string) => {
// acc: new Date() passed from startWIth
// curr: string, passed from mapTo
console.log(acc, curr);
const date: Date = new Date(acc.getTime());
if(curr === "second"){
date.setSeconds(date.getSeconds() + 1);
}
if(curr === "hour"){
date.setHours(date.getHours() +1 );
}
return date;
});
}
}
bootstrap(App);
[Angular 2] Mapping Streams to Values to Affect State
标签：
原文地址：http://www.cnblogs.com/Answer1215/p/5436090.html
