Observableから入ってくるデータをキャンセルする

Question

私は値が変わるたびに角を入力します。私は入力された値に関するデータを取得するようにサービスに頼みます。私は最後に入力された入力を気にするだけなので、ユーザーが '1'を入力してからそれを消去して '2'を入力すると、以前の値に関するデータは気にしません。私はこのような何か（私はprevNrで前の要求の値を保持）を書いた：私は、コンソールに戻って何を得る

let stream, 
    nr = document.querySelector('input').value; 

if (status === `${nr} in progress`) { 
    stream.unsubscribe(); 
    console.log(`subscription of ${prevNr} cancelled`) 
} 

status = 'in progress'; 
prevNr = nr; 

console.log(`started subscription of ${nr}`) 
stream = someService.someMethod.subscribe(() => { 
    const clonedNr = nr; 
    setTimeout(() => { 
    status = 'done'; 
    console.log(`received response for ${clonedNr}`) 
    }, 12000); 
}) 

は私がしたsetTimeout（）で応答を模擬今

1 in progress 

subscription of 1 cancelled 
2 in progress 

subscription of 2 cancelled 
3 in progress 

subscription of 3 cancelled 
4 in progress 

received response for 1 
received response for 2 
received response for 3 
received response for 4 

ですが、私はすることができます入力3のデータの前に入力4のデータを受け取り、このデータが間違った入力に割り当てられる状況を想像してください。 Observableで以前のリクエストを省略するにはどうすればよいですか？それは可能ですか？

Answer 1

いくつかの注意事項：

おそらくnrストリームにデバウンスを追加します。そうすれば、ユーザーが複数の番号を迅速に入力した場合、各番号の要求は送信されません。 debounceTime()は、値が入力されてから設定された時間（ミリ秒）を待つことができます。その時間に新しい値が入力されなければ、その値は引き継がれます。設定した時間内に新しい値が入力されると、時間はリセットされます。リンスとリピート。

subscribe()で非同期作業を行うべきではありません。「kind of」はRxを中断します。すべての非同期作業は、subscribe()の前に別の演算子で実行する必要があります。非常に頻繁に1つの*Map()演算子。

---

私は、観察someMethod()リターンを仮定している（または、あなたはおそらく1に変換することができます）と、その場合には、あなたはswitchMap()オペレータをお勧めします。あなたはswitchMap()の中に観測可能なものを返し、それは最も最近の観測可能なものだけを購読します。それはまた、以前の観察可能なものから退会するでしょう。サブスクライブ第三のコールバック関数は、[終了]のためのものである

let stream, 
nr = document.querySelector('input').value 
    .debounceTime(500); // This will wait 500 ms before passing on a value 
         // If a new value arrives before 500ms has passed, it resets the time 

stream = nr 
    .switchMap(num => someService.someMethod(num)) 
    .subscribe(clonedNr => console.log(`received response for ${clonedNr}`));