Angular 7：使用异步管道过滤多个关键点上的搜索结果

我想知道如何使用异步管道过滤使用多个对象属性的搜索结果。目前，我可以根据name属性进行筛选并显示筛选结果，但我也希望能够搜索username属性。以下是我目前掌握的情况： 在我的TS文件中：

  public formSetup = this.fb.group({
    formSearch: new FormControl('')
  })

  constructor(private service: Service,
              private fb: FormBuilder) { }

  ngOnInit(): void {
   this.getFilters();
  }

  public getFilters() {

    const filter = (val: string): Observable<Array<object>> => {

      return this.service.getItems()
        .pipe(
          map(response => response.filter(option => {
            const value = `${option.name}`
            return value.toLowerCase().indexOf(val.toLowerCase()) === 0;
          }))
        );

    }

    this.filteredItems = this.formSetup.get('formSearch').valueChanges
      .pipe(
        startWith(null),
        debounceTime(200),
        distinctUntilChanged(),
        switchMap(val => {
          return filter(val || '');
        })
      );
  }

public formSetup=this.fb.group({
formSearch:新的FormControl（“”）
})
建造商（私人服务：服务、，
私有fb:FormBuilder）{}
ngOnInit（）：void{
这个.getFilters（）；
}
公共getFilters（）{
常量过滤器=（val:string）：可观察=>{
返回此.service.getItems（）
.烟斗(
映射（response=>response.filter（选项=>{
常量值=`${option.name}`
返回值.toLowerCase（）.indexOf（val.toLowerCase（））==0；
}))
);
}
this.filteredItems=this.formSetup.get（'formSearch'）.valueChanges
.烟斗(
startWith（空），
去BounceTime（200），
distinctUntilChanged（），
开关映射（val=>{
返回过滤器（val | |“”）；
})
);
}

在我的HTML文件中：

  <input type="text" formControlName="formSearch">
</div>

<search [items]="filteredItems"></search>

最后，在显示结果的组件中：

<search-card *ngFor="let item of (items | async ); trackBy:trackingFn" [items]="item"></search-card>

---

您可以修改

filter（）

方法来同时搜索

username

属性

return this.service.getItems()
  .pipe(
     map(response => response.filter(option => {
       const value = `${option.name}`;
       const username = `${option.username}`;
       return value.toLowerCase().indexOf(val.toLowerCase()) === 0 ||
         username.toLowerCase().indexOf(val.toLowerCase()) === 0;
     }))
   );

---

您可以修改

filter（）

方法来搜索

username

属性

return this.service.getItems()
  .pipe(
     map(response => response.filter(option => {
       const value = `${option.name}`;
       const username = `${option.username}`;
       return value.toLowerCase().indexOf(val.toLowerCase()) === 0 ||
         username.toLowerCase().indexOf(val.toLowerCase()) === 0;
     }))
   );