web-dev-qa-db-fra.com

Comment faire un compte à rebours avec RxJS Observables?

J'ai du mal à créer un compte à rebours à l'aide d'Observables, les exemples à http://reactivex.io/documentation/operators/timer.html ne semblent pas fonctionner. Dans cet exemple spécifique, l'erreur liée à timerInterval n'étant pas une fonction de l'observable renvoyé par timer. 

J'ai également expérimenté d'autres approches et le meilleur que j'ai trouvé est:

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

Le problème ici est qu’il compte entre 0 et 10 et je veux un compte à rebours, par exemple. 10,9,8 ... 0.

J'ai aussi essayé cela, mais la variable timer n'existe pas pour le type Observable.

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

Ainsi que, qui ne produit aucune sortie du tout.

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

Pour clarifier, j'ai besoin d'aide pour la mise en œuvre de RxJS de ReactiveX, pas pour la version MircoSoft.

rxjsobservablereactive-programming
10
Jonathan Miles

Vous étiez sur la bonne voie - votre problème était que timer n’existe pas sur le prototype (et donc sur Observable.range()) mais sur Observable (voir RxJS docs ). C'est à dire. 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));
23
Niklas Fasching

Avec intervalle, vous permet de spécifier la durée d'une seconde.

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))
0
Zafer Qadi