Angular2数据表筛选列

import { Component } from '@angular/core';

@Component({
  selector: 'app-data-table',
  template: `
    <input type="text" [(ngModel)]="searchText" placeholder="Search...">
    <table>
      <tr *ngFor="let item of filteredData = (data | filter: searchText)">
        <td>{{item.name}}</td>
        <td>{{item.age}}</td>
      </tr>
    </table>
  `
})
export class DataTableComponent {
  data = [
    { name: 'Alice', age: 30 },
    { name: 'Bob', age: 25 },
    { name: 'Charlie', age: 35 }
  ];
  searchText = '';
}

import { Pipe, PipeTransform } from '@angular/core';

@Pipe({
  name: 'filter'
})
export class FilterPipe implements PipeTransform {
  transform(items: any[], searchText: string): any[] {
    if (!items) return [];
    if (!searchText) return items;
    searchText = searchText.toLowerCase();
    return items.filter(item => {
      return item.name.toLowerCase().includes(searchText);
    });
  }
}