使用angular for-each按列(td)过滤

<table>
  <tr *ngFor="let item of items">
    <td>{{ item.column1 }}</td>
    <td>{{ item.column2 }}</td>
    <td>{{ item.column3 }}</td>
  </tr>
</table>

items = [
  { column1: 'value1', column2: 'value2', column3: 'value3' },
  { column1: 'value4', column2: 'value5', column3: 'value6' },
  { column1: 'value7', column2: 'value8', column3: 'value9' }
];

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

@Pipe({
  name: 'columnFilter'
})
export class ColumnFilterPipe implements PipeTransform {
  transform(items: any[], column: string, filterValue: string): any[] {
    if (!items || !column || !filterValue) {
      return items;
    }

    return items.filter(item => item[column].toLowerCase().includes(filterValue.toLowerCase()));
  }
}

<input type="text" [(ngModel)]="filterValue" placeholder="Filter by column" />
<table>
  <tr *ngFor="let item of items | columnFilter:'column1':filterValue">
    <td>{{ item.column1 }}</td>
    <td>{{ item.column2 }}</td>
    <td>{{ item.column3 }}</td>
  </tr>
</table>