RxJs - Subject, BehaviorSubject, ReplaySubject, AsyncSubject

RxJs - Subject, BehaviorSubject, ReplaySubject, AsyncSubject

by ayyanarj

HTML

<script src="https://unpkg.com/@reactivex/[email protected]/dist/global/Rx.js"></script>
<input type="text" id="text1" placeholder="Subject Emitting Value">
<br>
<br>

<input type="button" id="button1" value="Send Subject Value">
<input type="button" id="subscribe1" value="Subscribe 1">
<input type="button" id="subscribe2" value="Subscribe 2">
<input type="button" id="complete1" value="Complete 1">

JavaScript

var button1 = document.querySelector('#button1');
var subscribe1 = document.querySelector('#subscribe1');
var subscribe2 = document.querySelector('#subscribe2');

var complete1 = document.querySelector('#complete1');


var text1 = document.querySelector('#text1');


var button1Event = Rx.Observable.fromEvent(button1, 'click');
var subscribe1Event = Rx.Observable.fromEvent(subscribe1, 'click');
var subscribe2Event = Rx.Observable.fromEvent(subscribe2, 'click');

var complete1Event = Rx.Observable.fromEvent(complete1, 'click');


var sub1 = new Rx.AsyncSubject();

button1Event.subscribe(buttonEvent => {
	sub1.next(text1.value);
});


subscribe1Event.subscribe(buttonEvent => {
	sub1.subscribe(data => {
  	console.log('Subcriber 1 Value: ', data);
  });
});


subscribe2Event.subscribe(buttonEvent => {
	sub1.subscribe(data => {
  	console.log('Subcriber 2 Value: ', data);
  });
});


complete1Event.subscribe(buttonEvent => {
  console.log('Completing the Subject Observable');
	sub1.complete();
});