Angular - 如何从数据（字段）的多个属性中过滤（搜索）数据？

Question

我正在通过 API 获取我的数据。我想对数据进行过滤和搜索。 我创建了一个管道，它具有以下代码：

文件：text-search.pipe.ts

transform(items: any[], searchText: string): any {
    if (!items) return [];

    if (!searchText) return items;
    console.log("ITEMS ARE",items);
    searchText = searchText.toLowerCase();


    return items.filter(it => {
        return it.hospital_name.toLowerCase().includes(searchText);
    });

  }

我的component.html文件如下：

输入栏 //用户可以按名字搜索

 <input type="text" [(ngModel)]="searchText" class="form-control" placeholder="Search">

然后管道被应用到：

 <div class="col-lg-3 col-md-4 col-sm-6" *ngFor="let hospital of hospital_list | hospitalSearch: searchText; let i = index;">

问题： 如果我有另一个输入字段或其他几个字段，例如用户可以搜索城市、专业等的城市字段？

例如：

 <input type="text" [(ngModel)]="searchCity" class="form-control" placeholder="Search">

那么我该如何修改现有的管道呢？还是我必须创建一个新管道。

我尝试过的事情： 在pipe.ts 文件中：

transform(items: any[], searchText: string, searchCity?: string): any {
    if (!items) return [];

    if (!searchText) return items;
    console.log("ITEMS ARE",items);
    searchText = searchText.toLowerCase();

    if (!searchCity) return items;
    console.log("ITEMS ARE",items);
    searchCity= searchCity.toLowerCase();


    return items.filter(it => {
        return it.hospital_name.toLowerCase().includes(searchText);
        return it.hospital_city.toLowerCase().includes(searchCity);

    });

它不起作用，因为第二个 return 语句无法访问。我试图阅读我没有找到任何支持的 API。请指导我如何向我获取的数据添加多个字段搜索过滤。谢谢你。 }

Answer 1

在此处使用布尔运算符。您需要选择最适合您的特定过滤用例的一种。

过滤至少符合以下一项的项目：

return items.filter(it => {
    return it.hospital_name.toLowerCase().includes(searchText)
        || it.hospital_city.toLowerCase().includes(searchCity);
});

过滤所有匹配的项目：

return items.filter(it => {
    return it.hospital_name.toLowerCase().includes(searchText)
        && it.hospital_city.toLowerCase().includes(searchCity);
});

要使用多个参数调用管道，请使用另一个 :。

*ngFor="let hospital of hospital_list | hospitalSearch: searchText:searchCity"