Angular 8 ngFor表td无法在数据表中排序或搜索

<!-- 在模板中定义输入框和表格 -->
<input type="text" [(ngModel)]="searchKeyword" placeholder="搜索">
<table>
  <thead>
    <tr>
      <th (click)="sortData('name')">名称</th>
      <th (click)="sortData('age')">年龄</th>
      <th (click)="sortData('gender')">性别</th>
    </tr>
  </thead>
  <tbody>
    <tr *ngFor="let item of filteredData">
      <td>{{ item.name }}</td>
      <td>{{ item.age }}</td>
      <td>{{ item.gender }}</td>
    </tr>
  </tbody>
</table>

// 在组件中定义数据和排序/搜索逻辑
export class MyComponent {
  data = [
    { name: '张三', age: 25, gender: '男' },
    { name: '李四', age: 30, gender: '女' },
    { name: '王五', age: 28, gender: '男' }
  ];
  filteredData = this.data;
  searchKeyword = '';

  sortData(property: string) {
    this.filteredData.sort((a, b) => a[property] > b[property] ? 1 : -1);
  }

  get filteredData() {
    return this.data.filter(item =>
      item.name.toLowerCase().includes(this.searchKeyword.toLowerCase())
    );
  }
}