2017-11-01 8 views
0

私はスライダを持っています。パーセンテージに応じて色を変えたい。これとは別に、ユーザーがマウスをN秒間移動しないと、ツールチップを表示したい。 私は考えられる解決策について考えることができますが、これは正しい方法のようには思われません。このタスクを達成するためのよりよい方法はありますか?RxJs5は動きのないときに放射します

Rx.Observable.fromEvent(container,"mousemove") 
.debounceTime(30) 
.switchMap(
    () => Rx.Observable.race(
     Rx.Observable.fromEvent(container,"mousemove").map(
      (v) => "Continue changing color" 
     ), 
     Rx.Observable.interval(2000).map(
      (v) => "Show tooltip!" 
     ) 
    ) 
) 
.subscribe(
    v => console.log(v) 
) 

ありがとうございます。

答えて

3

イベントソースから開始し、指定した時間後に発行されるタイマーにシーケンスを切り替えます。イベントソースが発生すると、別のタイマーが作成され、それ以降に何が起こるかが遅れます。

fromEvent(container,"mousemove") 
    .switchMap(() => timer(IDLE_TIME)) 
    .do(() => { /* show tooltip */ }) 
    .subscribe() 
関連する問題