首页 > Web开发 > 详细

[Angular 2] Managing State in RxJS with StartWith and Scan

时间:2016-04-26 07:03:56      阅读:263      评论:0      收藏:0      [点我收藏+]

The scan operator in RxJS is the main key to managing values and states in your stream. Scan behaves just as a reduce function would, but scan is able to collect values from streams over time. This lesson covers using startWith to set the initial accumulator value then using scan to update the value of the clock from the clicks and interval.

 

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),
            this.click$
        )
            .startWith(new Date())
            .scan( (acc: Date, curr) => {
                const date = new Date(acc.getTime());
                date.setSeconds(date.getSeconds() + 1);
                return date;
            });
    }
}

bootstrap(App);

 

[Angular 2] Managing State in RxJS with StartWith and Scan

原文:http://www.cnblogs.com/Answer1215/p/5433555.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!