eliminating-the-subscription-for-an-observable-example5

An example for "Eliminating the Subscription for an Observable in Several Ways" article ☞ https://goo.gl/asCv1B

by Nitay Neeman

HTML

<script src="https://unpkg.com/@reactivex/[email protected]/dist/global/Rx.js"></script>
<script src="https://rawgit.com/eu81273/jsfiddle-console/master/console.js"></script>
<button id="start-button">Start counting</button>
<button id="stop-button">Stop</button>

JavaScript

const startButton = document.querySelector('#start-button');

// This observable is only for starting the demonstration manually
Rx.Observable
  .fromEvent(startButton, 'click')
  .first()
  .subscribe(() => {
    const stopButton = document.querySelector('#stop-button');
  
	  const stop$ = Rx.Observable
	    .fromEvent(stopButton, 'click')
	    .first();
 
    stop$
      .subscribe(
	      () => {},
	      (error) => console.error(error),
	      () => console.log('Click listener completed')
	    ); 
  
	  Rx.Observable
	    .interval(1000)
	    .takeUntil(stop$)
	    .subscribe(
	      (value) => console.log(`Emitted value: ${value}`),
	      (error) => console.error(error),
	      () => console.log('Interval completed')
	    );     
  }
);