2017-08-24 8 views
1

要約:私はRxjsと初心者を使用しています。私はこのようなシナリオを、観測可能に実装したいと思っていますが、これまでのところ運がなかったのです。rxjsバッファが新しいargの到着時にリセットされるまで

loadDetailsFromServer(itemIds)という関数があり、サーバーAPIを呼び出し、いくつかのアイテムIDを渡します。この関数は散発的に呼び出されます。サーバーコールを最適化するには、ここで私がしたいことがあります。 最初の関数呼び出しが到着すると、タイムアウトが発生します。タイムアウトの前に新しい関数呼び出しが到着すると、タイムアウトがリセットされて再び開始されます。タイムアウトが発生すると、サーバーコールが行われ、引数のカウントはゼロにリセットされます。ここで

は大理石風の図である。

Timer is 4 clicks. 
INPUTS IN TIME  1-2---3-4-----5--------6-7-------- 
loadDetailsFromServer [1,2,3,4] -  [5]   -[6,7] 

function called with [1,2,3,4] because no more calls after 4 clicks. 

ヒント:これは検索ボックスのサンプルと同様のものであり、暫定値に関心がある、と無視されていない/スキップことを除いて、サーバーから結果を取得します。あなたはこのような観察可能なソースがある場合たとえば

答えて

0

は:

const Rx = require('rxjs/Rx'); 
const Observable = Rx.Observable; 

const TIMEOUT = 1000; 

const source = Observable.range(1, 20) 
    .concatMap(v => Observable.of(v).delay(Math.random() * 2000)); 

を次に、scanを使用して、その値をバッファリングすることができます。バッファをリセットするには、.merge(bufferNotifier.mapTo(null))を使用しています。それでswitchMap()で私はいつもforkJoin()が放出するために1000msを待つ。そうでない場合は、新しいバッファが到着したので、それは別の観測による「上書き」です:

const bufferNotifier = new Subject(); 

const chain = source 
    .do(undefined, undefined,() => bufferNotifier.complete()) // properly complete the chain 
    .merge(bufferNotifier.mapTo(null)) // reset buffer Subject 
    .scan((acc, val) => { 
     if (val === null) { 
      return []; 
     } 
     acc.push(val); 
     return acc; 
    }, []) 
    .filter(arr => arr.length > 0) 
    .switchMap(buffer => { // wait 1s until emitting the buffer further 
     return Observable.forkJoin(
      Observable.of(buffer), 
      Observable.timer(1000).take(1), 
      arr => arr 
     ); 
    }) 
    .do(() => bufferNotifier.next()) // trigger reset the buffer 
    .subscribe(console.log); 

は、これは、例えば出力:

[ 1 ] 
[ 2 ] 
[ 3, 4 ] 
[ 5 ] 
[ 6, 7 ] 
[ 8, 9, 10, 11, 12 ] 
[ 13 ] 
[ 14, 15 ] 
[ 16 ] 
[ 17 ] 
[ 18 ] 
[ 19, 20 ] 
0

あなたがマーティンの答えに観察可能な類似したsourceを持っていた場合、このような何かを

source 
    .buffer(source.debounceTime(250)) 
    .subscribe(console.log); 

bufferは、特定の観測値が放出されるまで放出された値をすべて収集します。この場合、debounceTimeが出るまで待つ。コードペーン:https://codepen.io/anon/pen/PKBaZm?editors=1010

関連する問題