问如何在Angular2中使用管道和分页？

EN

<div class="form-inline">

   <div class="form-group">
       <div class="input-group">
           <div class="input-group-addon"><i class="glyphicon glyphicon-search pull-left"></i></div>
                <input type="text" placeholder="Employee name" class="form-control" [(ngModel)]="filter">
                <div class="input-group-addon"><i class="glyphicon glyphicon-user pull-right"></i></div>
           </div>
       </div>
    </div>

    <table class="table table-hover table-striped table-sortable">
      <thead>
        <tr>
          <th *ngFor="let column of table.columns" [class]="selectedClass(column.variable)" (click)="changeSorting(column.variable)">
                {{column.display}}
          </th>
        </tr>
      </thead>
      <tbody>
        <tr *ngFor="let object of table.data | orderBy : convertSorting() | search:{filter:filter}">
          <td *ngFor="let column of table.columns">
                {{object[column.variable]}}
          </td>
        </tr>
      </tbody>
    </table>
    <ul class="pager" *ngIf="pager.visible">
        <li><a href="#" (click)="changePage('decrease')"><i class="fa fa-icon fa-chevron-left"></i></a></li> 
        <li *ngFor="let page of pager.pages; let i = index" [class]="pageSelected(i + 1)"><a href="#" (click)="changePage(i + 1)" > {{i + 1}} </a></li>
        <li><a href="#" (click)="changePage('increase')"><i class="fa fa-icon fa-chevron-right"></i></a></li>
    </ul>                   
</div>