eliminating-the-subscription-for-an-observable-example4

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

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');
    let isDone = false;
  
	  Rx.Observable
	    .fromEvent(stopButton, 'click')
	    .first()
	    .subscribe(
	      () => isDone = true,
	      (error) => console.error(error),
	      () => console.log('Click listener completed')
	  );

	  Rx.Observable
	    .interval(1000)
	    .takeWhile(() => !isDone)
	    .subscribe(
	      (value) => {
        	console.log(`Emitted value: ${value}`);
          isDone = true;
        	},
	      (error) => console.error(error),
	      () => console.log('Interval completed')
	  );     
  }
);