RxJS Text filter input

foo.component.html

<input class="iconized" type="text" [ngModel]="search" (ngModelChange)="onChangeSarch($event)" />

foo.component.ts

    
  private searchChanged$ = new Subject<string>();
  public search: string = null;

  ngOnInit(): void {
    this.searchChanged$
      .pipe(takeUntil(this.destroy$), debounceTime(300), distinctUntilChanged())
      .subscribe((searchFilter) => this.onSearchFilter(searchFilter));
  }

  onChangeSarch(textFilter: string) {
    this.searchChanged$.next(textFilter);
  }

  onSearchFilter(textFilter: string) {
    this.currentFilter = this.FILTER.SEARCH;
    this.search = textFilter;
    if (!textFilter) {
      this.onFilter(this.FILTER.ALL);
      return;
    }

    this.filtedSkills$.next(
      this.skills
        .filter((skill) => skill.name.toLocaleUpperCase().includes(textFilter.toLocaleUpperCase()))
        .sort(this.sortBy(this.currentOrder))
    );
  }