Как сделать таймер обратного отсчета с наблюдаемыми RxJS?

Я изо всех сил пытаюсь создать таймер обратного отсчета, используя наблюдаемые, примеры в http://reactivex.io/documentation/operators/timer.html кажется, что не работает. В этом конкретном примере ошибка, связанная с timerInterval, не является функцией наблюдаемого, возвращаемого из timer.

Я также экспериментировал с другими подходами и лучшее, что я придумал это:

Observable.interval(1000).take(10).subscribe(x => console.log(x));

проблема здесь в том, что он рассчитывает от 0 до 10, и я хочу таймер обратного отсчета например, 10,9,8...0.

Я также пробовал это, но timer не существует для типа Observable

Observable.range(10, 0).timer(1000).subscribe(x => console.log(x));

а также, который не производит никакого выхода вообще.

Observable.range(10, 0).debounceTime(1000).subscribe(x => console.log(x));

чтобы уточнить, мне нужна помощь с реализацией RxJS ReactiveX, а не с версией MircoSoft.

2 ответов


Вы были на правильном пути - ваша проблема в том, что timer не существует на прототипе (и, следовательно, на Observable.range()), но на наблюдаемом (см. RxJS docs). Т. е. jsbin

const start = 10;
Rx.Observable
  .timer(100, 100) // timer(firstValueDelay, intervalBetweenValues)
  .map(i => start - i)
  .take(start + 1)
  .subscribe(i => console.log(i));

// or
Rx.Observable
  .range(0, start + 1)
  .map(i => start - i)
  .subscribe(i => console.log(i));

С интервалом, позволяет указать, как долго вторая

const time = 5 // 5 seconds
var timer$ = Rx.Observable.interval(1000) // 1000 = 1 second
timer$
  .take(time)
  .map((v)=>(time-1)-v) // to reach zero
  .subscribe((v)=>console.log('Countdown', v))