Angular 2: text filter on input text change
<p><strong>Angular2</strong>, in my <code>component.ts</code>, I grab a list of Video Objects and store in <code>_videos:Video[]</code></p>

<p>In my html, I display the videos, </p>

<pre><code>&lt;tr *ngFor="#video of _videos"&gt;
</code></pre>

<p>Now I want to create a search input field in the html to filter the videos. I am trying to use pipe:</p>

<pre><code>import {Pipe,PipeTransform} from 'angular2/core';

@Pipe({
  name: 'textfilter'
})

export class TextFilterPipe implements PipeTransform {
  transform(items: any[], args: any[]): any {
    if(args[1].toString().length === 0)
      return items;
    return items.filter(item =&gt; item[args[0]].indexOf(args[1]) !== -1);
  }
}
</code></pre>

<p>in <code>ts</code>,</p>

<pre><code>private _videoTitleFilter: string ='';
</code></pre>

<p>in <code>html</code>,</p>

<pre><code>  &lt;tr&gt;
    &lt;th&gt;&lt;input id="videoTitleFilter" placeholder="Filter"&gt;{{_videoTitleFilter}}&lt;/th&gt;
    &lt;th&gt;&lt;/th&gt;
    &lt;th&gt;&lt;/th&gt;
    &lt;th&gt;&lt;/th&gt;
  &lt;/tr&gt;
  &lt;tr *ngFor="#video of _videos |textfilter:'title':_videoTitleFilter"&gt;
</code></pre>

<p>It seems the binding is not working. The pipe works for the first time. Is it right to use pipe here? Or I should create a new array <code>_videoList: Video[]</code>, listen to the keyup event with throttle to change the <code>_videoList</code> and use it in <code>*ngFor</code>, instead of <code>_videos</code> ?  </p>