title: Angular 2 - Debouncing a keyUp event
body: <p>How can I debounce a function which gets called on an "keyUp" event?</p>
  
  <p>Here is my code:</p>
  
  <p><strong>My Function</strong></p>
  
  <pre><code>private handleSearch(searchTextValue: string, skip?: number): void {
      this.searchTextValue = searchTextValue;
      if (this.skip === 0 || typeof skip === "undefined") {
          this.skip = 0;
          this.pageIndex = 1;
      } else {
          this.skip = skip;
      }
      this.searchTextChanged.emit({ searchTextValue: searchTextValue, skip: this.skip, take: this.itemsPerPage });
  }
  </code></pre>
  
  <p><strong>My HTML</strong></p>
  
  <pre><code>&lt;input type="text" class="form-control" placeholder="{{ 'searchquery' | translate }}" id="searchText" #searchText (keyup)="handleSearch(searchText.value)"&gt;
  </code></pre>
  
  <p><em>Bassically what I'm trying to achieve is that <code>handleSearch</code> gets called a few moments after the user stop typing.</em> </p>
  
  <p>I found out i can use lodash's <code>_debounce()</code> for this, but I haven't found out how to put this on my <code>keyUp</code> event.</p>