Exploring RxJS and attempting to create a basic stream of button clicks, I tried the following approach:
export class AppComponent {
button : HTMLElement = document.querySelector('button');
refreshClickStream$ = Observable.fromEvent(this.button, 'click')
.subscribe();
constructor(){
}
However, upon execution, an error was displayed in the console.
I then made another attempt using this method:
clicked(e) {
return Observable.fromEvent(e.target, 'click')
.do(console.log)
.subscribe();
}
After the first click, no output appeared in the console. Subsequent clicks resulted in one MouseEvent object after the second click, two MouseEvent objects after the third click, three MouseEvent objects after the fourth click, and so on. It seems like the click event handler may be duplicating with the RxJS fromEvent function.
If anyone has any insights or explanations, they would be greatly appreciated.