[RxJS] Stopping a Stream with TakeUntil

Observables often need to be stopped before they are completed. This lesson shows how to use

takeUntil

to stop a running timer. Then we use the starting stream and the stopping stream together to create a simple stopwatch.

const Observable = Rx.Observable;

const startButton = document.querySelector('#start');
const stopButton = document.querySelector('#stop');

const start$ = Observable.fromEvent(startButton, 'click');
const interval$ = Observable.interval(1000);
const stop$ = Observable.fromEvent(stopButton, 'click');

const intervalThatStops$ = interval$
.takeUntil(stop$);

start$
.switchMapTo(intervalThatStops$)
.subscribe((x)=> console.log(x));