Angular2 get entire input value on keypress or keydown
<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>