2017-02-23 1 views
3

私は使用していますrxjs 5.0Rx.Observable bufferCountをイベント駆動型タイムアウトでクリアしますか?

このバッファではどのようにタイムアウトを設定できますか?キーアップイベントが5秒間発生しなかった場合、bufferCount(11)はクリアされますか?

var keys = Rx.Observable.fromEvent(document, 'keyup'); 
var buffered = keys.bufferCount(11,1); 
buffered.subscribe(x => console.log(x)); 

答えて

1

あなたは、特定のタイムアウト(あなたのケースでは5秒)の後に、新鮮なbufferedを返すことができtimeoutWithを、追加することができます。改良として

const keys$ = Rx.Observable.fromEvent(document, "keyup") 
 
    .map(ev => ev.keyCode|| ev.which); // this is just to have a readable output here in the SO-console 
 
    
 
const buffered$ = keys$ 
 
    .bufferCount(3,1) // replaced your 11 with 3 for easy demonstration 
 
    .timeoutWith(2000, Rx.Observable.defer(() => { // replaced 5 with 2 seconds (easier to test here) 
 
    console.log("New Buffer!"); 
 
    return buffered$; 
 
    })); 
 

 
buffered$.subscribe(console.log);
<script src="https://unpkg.com/rxjs/bundles/Rx.min.js"></script>


、これだけでもそうでない場合は、私たちが実行して一定のタイムアウトは(重要ではないだろう、最初ストロークにストリームを開始するように拡張することができしかし、まだ防止することができる)。 windowswitchMap()を使用して

const keys$ = Rx.Observable.fromEvent(document, "keyup") 
 
    .map(ev => ev.keyCode|| ev.which); // this is just to have a readable output here in the SO-console 
 

 
const buffered$ = keys$ 
 
    .take(1) 
 
    .switchMap(firstKey => { 
 
    console.log("New Buffer!"); 
 
    return keys$ 
 
    .startWith(firstKey) 
 
    .bufferCount(3,1) // replaced your 11 with 3 for easy demonstration 
 
    .timeoutWith(2000, Rx.Observable.defer(() => buffered$)); // replaced 5 with 2 seconds (easier to test here) 
 
    }); 
 

 
buffered$.subscribe(console.log);
<script src="https://unpkg.com/rxjs/bundles/Rx.min.js"></script>

0

私は別のものを持っている(と理解した方が簡単でしょ)ソリューション:

var keys = Rx.Observable.fromEvent(document.getElementById('myinput'), 'keyup') 
    .map(event => event.keyCode) 
    .share(); 

var buffered = keys 
    .window(keys.debounceTime(5000)) 
    .switchMap(observable => observable.bufferCount(5, 1)) 
    .filter(buffer => buffer.length === 5); 

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

参照のデモ:あなたは入力しないhttps://jsbin.com/cakoru/17/edit?js,console,output

少なくとも5秒間、オペレータは新しいObserを作成します内部でswitchMap()に登録され、新しい.bufferCount()演算子でチェーンされたvableです。ここで

0

は、私はそれを行うだろう方法は次のとおりです。

const keys$ = Rx.Observable.fromEvent(document, 'keyup').map(ev => ev.keyCode|| ev.which); 

keys$ 
    .debounceTime(5000) 
    .startWith({}) 
    .switchMap(x => keys$.bufferCount(11, 1)) 
    .subscribe(x => console.log(x)); 

switchMapsバッファカウントにすることをここでは、(ダミー値でキックオフ)5秒間停止を入力して値を毎回生成ストリームを持っています。

関連する問題