From event in RXJS

rxjs| Updated on November 21, 2024

In this tutorial, we will learn about from event of RXJS.

Turn the event into an observable sequence

This operator will give output as an observable that is to be used on elements that emit events for example buttons, clicks, etc.

Parameters

target − The target is the dom element

eventName − eventName you want to capture for example click, mouseover, etc.

Return value

It returns an observable.

syntax:

fromEvent(target: eventtarget, eventName: string): Observable

Example:

<button #addBtn class="btn btn-primary">Add</button>

---------------------------
@ViewChild("addBtn", { static: false }) addBtn: ElementRef;

let count = 1;
fromEvent(this.addBtn.nativeElement, "click").subscribe((response) => {
  let countVal = count++;     
  console.log(countVal);
});

Output:
1,2,3,4,5.....