En este escenario, estoy mostrando una lista de estudiantes (matriz) a la vista conngFor:

<li *ngFor="#student of students">{{student.name}}</li>

Es maravilloso que se actualice cada vez que agrego otro estudiante a la lista.

Sin embargo, cuando le doy unpipe afilter por el nombre del alumno,

<li *ngFor="#student of students | sortByName:queryElem.value ">{{student.name}}</li>

No actualiza la lista hasta que escribo algo en el campo de filtrado del nombre del alumno.

Aquí hay un enlace aplnkr.

Hello_world.html

<h1>Students:</h1>
<label for="newStudentName"></label>
<input type="text" name="newStudentName" placeholder="newStudentName" #newStudentElem>
<button (click)="addNewStudent(newStudentElem.value)">Add New Student</button>
<br>
<input type="text" placeholder="Search" #queryElem (keyup)="0">
<ul>
    <li *ngFor="#student of students | sortByName:queryElem.value ">{{student.name}}</li>
</ul>

sort_by_name_pipe.ts

import {Pipe} from 'angular2/core';

@Pipe({
    name: 'sortByName'
})
export class SortByNamePipe {

    transform(value, [queryString]) {
        // console.log(value, queryString);
        return value.filter((student) => new RegExp(queryString).test(student.name))
        // return value;
    }
}