您可以使用管道自定义搜索功能。以下是一个简单的示例:
HTML代码:
TypeScript代码:
import { Pipe, PipeTransform } from '@angular/core';
@Pipe({ name: 'filter' }) export class FilterPipe implements PipeTransform { transform(items: any[], searchTerm: string): any[] { if (!items) return []; if (!searchTerm) return items; searchTerm = searchTerm.toLocaleLowerCase(); return items.filter(item => { return item.name.toLocaleLowerCase().includes(searchTerm); }); } }
请注意,这只是一个简单的示例,您可以根据自己的要求进行更改和扩展。在HTML中,我们使用了双向绑定来获取搜索术语并将其传递给管道。在管道中,我们检查每个元素的名称是否包含搜索术语并返回匹配的元素。最后,我们在HTML中使用ngFor指令迭代匹配的项并将其显示出来。