首页 > Web开发 > 详细

[RxJS] Combining Streams with CombineLatest

时间:2016-03-11 06:25:38      阅读:134      评论:0      收藏:0      [点我收藏+]

Two streams often need to work together to produce the values you’ll need. This lesson shows how to use an input stream and an interval stream together and push an object with both values through the stream.

 

const Observable = Rx.Observable;

const startButton = document.querySelector(‘#start‘);
const halfButton = document.querySelector(‘#half‘);
const quarterButton = document.querySelector(‘#quarter‘);
const input = document.querySelector("#input");
const stopButton = document.querySelector(‘#stop‘);
const resetButton = document.querySelector(‘#reset‘);


const data = {count:0};
const inc = (acc)=> ({count: acc.count + 1});
const reset = (acc)=> data;


const start$ = Observable.fromEvent(startButton, ‘click‘);
const half$ = Observable.fromEvent(halfButton, ‘click‘);
const quarter$ = Observable.fromEvent(quarterButton, ‘click‘);
const stop$ = Observable.fromEvent(stopButton, ‘click‘);
const reset$ = Observable.fromEvent(resetButton, ‘click‘);
const starters$ =  Observable.merge(
    start$.mapTo(1000),
    half$.mapTo(500),
    quarter$.mapTo(250)
 );
const intervalActions = (time) => {
      return Observable.merge(
        Observable.interval(time)
        .takeUntil(stop$)
        .mapTo(inc),
        reset$.mapTo(reset)
      )
    };
const timer$ = starters$
 .switchMap(intervalActions)
 .startWith(data)
 .scan( (acc, curr) => curr(acc));
const input$ = Observable.fromEvent(input, "input")
  .map(ev=>ev.target.value);

Observable.combineLatest(
  timer$,
  input$
)
// We will get an array combineLatest
.map((array)=>{
  return {count: array[0].count, input: array[1]}
})
.subscribe(x => console.log(x))

 

They last param of combineLatest is a result function, which can parse the result in the fucntion:

Observable.combineLatest(
  timer$,
  input$,
  (timer, input)=>{
     return {count: timer.count, input}
  }
)
.subscribe(x => console.log(x))

 

[RxJS] Combining Streams with CombineLatest

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

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