plastikaweb
12/5/2016 - 6:28 PM

JS Bin// source https://jsbin.com/jewezex RxJS - stopping a stream with takeUntil

JS Bin// source https://jsbin.com/jewezex RxJS - stopping a stream with takeUntil

index.html
content_copyfile_download
<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <title>JS Bin</title>
  <script src="https://unpkg.com/@reactivex/rxjs@5.0.0-beta.7/dist/global/Rx.umd.js"></script>
</head>
<body>
  <button id="start">Start</button>
  <button id="stop">Stop</button>
<script id="jsbin-javascript">
'use strict';

var start = document.querySelector('#start');
var stop = document.querySelector('#stop');
var start$ = Rx.Observable.fromEvent(start, 'click');
var interval$ = Rx.Observable.interval(1000);
var stop$ = Rx.Observable.fromEvent(stop, 'click');
var intervalThatStops$ = interval$.takeUntil(stop$);

start$.switchMapTo(intervalThatStops$).map(function (x) {
    return 'num:' + x;
}).subscribe(function (x) {
    return console.log(x);
});
</script>

<script id="jsbin-source-html" type="text/html">
<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <title>JS Bin</title>
  <script src="https://unpkg.com/@reactivex/rxjs@5.0.0-beta.7/dist/global/Rx.umd.js"><\/script>
</head>
<body>
  <button id="start">Start</button>
  <button id="stop">Stop</button>
</body>
</html></script>


<script id="jsbin-source-javascript" type="text/javascript">const start = document.querySelector('#start');
const stop = document.querySelector('#stop');
const start$ = Rx.Observable.fromEvent(start, 'click');
const interval$ = Rx.Observable.interval(1000);
const stop$ = Rx.Observable.fromEvent(stop, 'click');
const intervalThatStops$ = interval$
    .takeUntil(stop$);

start$
  .switchMapTo(intervalThatStops$)
  .map((x) => 'num:' + x)
  .subscribe((x) => console.log(x));
</script></body>
</html>
jsbin.jewezex.js
content_copyfile_download
'use strict';

var start = document.querySelector('#start');
var stop = document.querySelector('#stop');
var start$ = Rx.Observable.fromEvent(start, 'click');
var interval$ = Rx.Observable.interval(1000);
var stop$ = Rx.Observable.fromEvent(stop, 'click');
var intervalThatStops$ = interval$.takeUntil(stop$);

start$.switchMapTo(intervalThatStops$).map(function (x) {
    return 'num:' + x;
}).subscribe(function (x) {
    return console.log(x);
});