如何在ng-select中搜索多个字段?

时间:2019-06-11 12:57:11

标签: angular6 angular5 angular7 angular-ngselect

我想在ng-select下拉列表中合并两个API字段“ 代码和名称”。 例如:-

  Code       : MI

  name       : MI 3sPrime

 Format      : MI - MI 3sPrime

我使用下面的代码进行下拉

Component.Html

<ng-select [items]="products" bindLabel="code" bindValue="id"
                placeholder="Select Goods Receipt" clearAllText="Clear" formControlName="productId" [searchFn]="customSearchFn">

                  <ng-template ng-label-tmp let-item="item">
                    <span [ngOptionHighlight]="search">{{ item.code }} - {{ item.name }}</span>
                  </ng-template>

                  <ng-template ng-option-tmp let-item="item" let-search="searchTerm" let-index="index">
                    <span [ngOptionHighlight]="search">{{ item.code }} - {{ item.name }}</span>
                  </ng-template>

</ng-select>

Component.ts

  customSearchFn(term: string, item: any) {
    term = term.toLocaleLowerCase();
    return item.code.toLocaleLowerCase().indexOf(term) > -1 || 
    item.name.toLocaleLowerCase().indexOf(term) > -1;
 }

搜索:搜索时正在获取代码和名称。但我想搜索代码,名称和给定格式(代码-名称)

下面是图

enter image description here

在这里,当我搜索“ MI-” 时,搜索不起作用

enter image description here

搜索应使用代码-名称格式。这意味着当我键入 MI-时,必须进行过滤。 有什么办法吗?有人可以帮我吗?

1 个答案:

答案 0 :(得分:1)

尝试

  customSearchFn(term: string, item: any) {
    term = term.toLocaleLowerCase();
    return item.code.toLocaleLowerCase().indexOf(term) > -1 || 
    item.name.toLocaleLowerCase().indexOf(term) > -1 || 
    (item.code + " - " + item.name).toLocaleLowerCase().indexOf(term) > -1;
 }