如何在angular html中从数组中过滤对象属性

// 组件中定义一个数组
public items = [
  { name: 'Apple', category: 'Fruit' },
  { name: 'Carrot', category: 'Vegetable' },
  { name: 'Orange', category: 'Fruit' },
  { name: 'Broccoli', category: 'Vegetable' }
];

<!-- 使用管道过滤对象属性 -->
<ul>
  <li *ngFor="let item of items | filterByCategory:'Fruit'">{{ item.name }}</li>
</ul>

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

@Pipe({
  name: 'filterByCategory'
})
export class FilterByCategoryPipe implements PipeTransform {
  transform(items: any[], category: string): any[] {
    // 过滤逻辑
    return items.filter(item => item.category === category);
  }
}

import { FilterByCategoryPipe } from './filter-by-category.pipe';

@NgModule({
  declarations: [
    // 声明管道
    FilterByCategoryPipe
  ],
  // 其他模块导入
})
export class AppModule { }