2017-11-01 9 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()