2017-01-24 1 views
1

スロットリングされたエミッションに基づいてバッファリングされたエミッションを作成しようとしています。次RxJs 2に期待されるような作品:rxjsバッファが私のために期待どおりにスロットルで動作しない

.buffer(function() { return clickStream.throttle(250); }) 

full jsfiddle example here

しかし、私は私の地元のプロジェクトでこれを使用しようとしたときには、次のエラーが返されます。ここでは

Uncaught TypeError: You provided '() => clickStream.throttle(250)' where a stream was expected. You can provide an Observable, Promise, Array, or Iterable.

は私ですコード

import Rx from 'rxjs/Rx'; 

const $button = document.getElementById('button'); 
const $label = document.getElementById('label'); 

const clickStream = Rx.Observable.fromEvent($button, 'click'); 

const doubleClickStream = clickStream 
    .buffer(() => clickStream.throttle(250)) 
    .map(arr => arr.length) 
    .filter(len => len === 2) 

clickStream.subscribe(x=>console.log(x)); 

doubleClickStream 
    .subscribe(() => $label.textContent = 'double click') 
// 
doubleClickStream 
    .throttle(1000) 
    .subscribe(() => $label.textContent = '-') 

このライブラリに関する私の現在の知識が十分ではないことを知っています。おそらく、それはrxjsのバージョンに関連しています(実際の例では2.xで、上のコードでは5.xです)。

私としても、それを書き込もうとしました:

.buffer(clickStream.throttle(250)) 

そしてそれは、ボタンをクリックした後、別の例外が発生しました:

Uncaught TypeError: this.durationSelector is not a function

は、あなたは私がそれはそれで間違って理解するのに役立つことはできますか?

+3

'throttle'の代わりに[throttleTime](http://reactivex.io/rxjs/class/es6/Observable.js~Observable.html#instance-method-throttleTime)を使用してください。 –

+0

.buffer(clickStream.throttleTime 250 ))仕事をする必要があります。 –

答えて

3

あなたの問題は、RxJs5が完全な書き換えであり、大きな変更点があることにあります。その中には、オペレータの名前変更や、異なるオペレータのオペレータ過負荷の分割があります。

エラーが発生したのは.throttle()です。このエラーは、RxJs5がバッファを閉じるときにObservableを返す関数を取ります。探しているオーバーロードがRxJs5で.throttleTime()に変更されました

この理由で、異なるバージョンのRxが混在していないことをお勧めします。 RxJs5を使い始める場合は、migration guideを見てどこに行ったのかを感じてください。

関連する問題