我将ng-select用于城市列表,如下所示:
cities = [
{id: 1, name: 'MA, Boston'},
{id: 2, name: 'FL, Miami'},
{id: 3, name: 'NY, New York', disabled: true},
{id: 4, name: 'CA, Los Angeles'},
{id: 5, name: 'TX, Dallas'}
];
在选择字段中,如果我输入“ MA,B”,则该字段将过滤为“ MA,Boston”,这是正确的。
但是,如果我输入“ MA Boston”,则该字段不会显示任何结果(许多用户可能会错过逗号)。
有没有办法使搜索功能忽略逗号,或者对它们不太敏感?
这是上面例子中的闪电战:
答案 0 :(得分:1)
答案 1 :(得分:1)
一个快速的技巧是将所有逗号替换为空字符串。
首先,在component.html上,您需要将searchFn
的输入属性绑定传递给您自己的custom search function。
<ng-select
[items]="cities"
[searchFn]="customSearchFn"
bindLabel="name"
placeholder="Select city"
[(ngModel)]="selectedCity">
</ng-select>
然后,在您的component.ts上,将使用以下方法定义customSearchFn
。这是一个快速的技巧,但是我所做的是用一个空字符串替换了该特定对象的逗号。像马萨诸塞州一样,波士顿将成为马萨诸塞州波士顿。
customSearchFn(term: string, item) {
item.name = item.name.replace(',','');
term = term.toLocaleLowerCase();
return item.name.toLocaleLowerCase().indexOf(term) > -1;
}