Ionic 3汉语搜索栏

Question

我正在建立一个搜索栏，可以根据插入的中文名称过滤项目。现在我可以根据其英文名称而不是中文进行搜索。

我应该如何处理中文文本搜索？

输出：

源代码： （HTML）

<ion-toolbar>
    <ion-searchbar aria-placeholder="search" 
                  [(ngModel)]="queryText"
                  (ionInput)="updateText()">
    </ion-searchbar>
  </ion-toolbar>
  <ion-item >

    <ion-label>Name</ion-label>
    <ion-label>Description</ion-label>
    <ion-label>Chinese Name</ion-label>
</ion-item>

<ion-item *ngFor="let item of filtered" >
  <ion-label>{{item.name}} </ion-label>
  <ion-label>{{item.description}} </ion-label>
  <ion-label>{{item.chinese}} </ion-label> 
</ion-item> 

在fd.name属性

上的英文

（过滤器功能）

updateText(){
    if (this.queryText == ""){ //if no text insert then display all
      this.filtered = this.food; // Original array with food elements can be [] also
    }
    else{
      this.filtered = this.food.filter((fd) => {
        return fd.name.toLowerCase().indexOf(this.queryText.toLowerCase()) > -1; //filter food.name
      })
    }

我应该将fd.name属性更改为fd.chinese名称吗？

Answer 1

如果要使用中文文本进行搜索，则必须首先使用原始列表，因为开始搜索时，代码将执行两次，首先是搜索文本形式是拼音，然后是中文文本。如果您不恢复列表，则无法获得结果过滤器。例如：

 if(this.searchQuery && this.searchQuery.trim() != ''){
      this.projectTimeLists = this.getBackUpProjectLists();
      this.projectTimeLists = this.projectTimeLists.filter((project) => {
        return (project.F_Name.toLowerCase().indexOf(this.searchQuery.toLowerCase()) != -1);
      });
  }