Angular 2 - Debouncing A KeyUp Event

Answer :

UPDATE: Using RXJS 6 pipe operator:

this.subject.pipe(   debounceTime(500) ).subscribe(searchTextValue => {   this.handleSearch(searchTextValue); }); 

---

You could create a rxjs/Subject and call .next() on keyup and subscribe to it with your desired debounceTime.

I'm not sure if it is the right way to do it but it works.

private subject: Subject<string> = new Subject();  ngOnInit() {   this.subject.debounceTime(500).subscribe(searchTextValue => {     this.handleSearch(searchTextValue);   }); }  onKeyUp(searchTextValue: string){   this.subject.next(searchTextValue); } 

HTML:

<input (keyup)="onKeyUp(searchText.value)"> 

An Update for Rx/JS 6. Using the Pipe Operator.

import { debounceTime } from 'rxjs/operators';  this.subject.pipe(       debounceTime(500)     ).subscribe(searchTextValue => {       this.handleSearch(searchTextValue);     }); 

Everything else is the same