title: How to implement debounce time on search key up
body: <p>I am implementing a search functionality in my app I wanted to implement debounce time on key up. Can anyone please help me with this</p>
  
  <p>HTML</p>
  
  <pre><code>&lt;div class="mt-4"&gt;
      &lt;div class="form-group has-search"&gt;
        &lt;span class="fa fa-search form-control-feedback"&gt;&lt;/span&gt;
        &lt;input type="search" class="form-control" [(ngModel)]="searchKeywords" (keyup)="getSmartSearchValues(searchKeywords)" (search)="clearSearch()" placeholder="Search here"&gt;
      &lt;/div&gt;
    &lt;/div&gt;
  </code></pre>
  
  <p>i have tries this, but it is showing error</p>
  
  <pre><code>  searchTextChanged = new Subject&lt;string&gt;();
  
  ngOnInit(): void {
      this.subscription = this.searchTextChanged
      .debounceTime(1000)
      .distinctUntilChanged()
      .mergeMap(search =&gt; this.getSmartSearchValues('', ''))
      .subscribe(() =&gt; { });
      this.getAllData();
      if (this.CoffeeItemList.length === 0) {
        this.empty = true;
      }
      this.getItemsCount('');
    }
  </code></pre>
  
  <p>Errors</p>
  
  <pre><code>Property 'debounceTime' does not exist on type 'Subject&lt;string&gt;'.
  Property 'subscription' does not exist on type 'AppComponent'
  </code></pre>