Debounce search fields in Angular

some-component.ts

// In HTML component
// <input placeholder="Search" ... (keyup)="onSearchKeyUp()" [(ngModel)]="searchFilter" />

// in .ts file
searchFilter: string;
private searchSubject: Subject<string> = new Subject();
private searchSubscription: Subscription;
          
filterItems() {
  // do the thing by searchFilter
}
          
onSearchKeyUp(){
  this.searchSubject.next();
}          

ngOnInit() {
  // setup the filter debounce
  this.searchSubscription = this.searchSubject.pipe(
    debounceTime(500)
  ).subscribe(() => {
    this.filterItems();
  });
}

ngOnDestroy() {
  // prevent memory leaks
  if (this.searchSubscription)
  {
    this.searchSubscription.unsubscribe();
  }
}