title: Angular2 get entire input value on keypress or keydown
body: <p>I may be going about this wrong because I am doing something simple but my solutions are very bug prone. </p>
  
  <p>All I want to do is execute a filter on a 3rd party component when input text changes (on key down).</p>
  
  <p><strong>first approach that didn't work:</strong></p>
  
  <pre><code>&lt;input type="text" placeholder="Name Fitler" [(ngModel)]="NameFilter" (keydown)="keyDown($event)" /&gt;
  </code></pre>
  
  <p>the problem is that key down executes before NameFilter is updated with latest characters, so my filter is one character behind</p>
  
  <p><strong>second approach that didn't work</strong></p>
  
  <pre><code>keyDown(event:KeyboardEvent){
      var input = &lt;HTMLInputElement&gt;event.srcElement; 
      this.NameFilter = input.value + event.key; // &lt;-- have to add the latest character
      this.filterChanged();
  }
  </code></pre>
  
  <p>this sort of works but is bug prone. input.value doesn't have the latest character so i am adding it but would need to worry about odd keys etc. I'd like to avoid keyCode filtering if i can. </p>
  
  <p>Is there another event ? or better way to get that value including the latest key down? (i do not want to wait for key up, or enter) </p>
  
  <p><strong>update</strong> this works perfectly</p>
  
  <pre><code>&lt;input type="text" placeholder="Name Fitler" [(ngModel)]="NameFilter" (ngModelChange)="filterChanged()" /&gt;
  </code></pre>