首页 > 解决方案 > 如果值与任何单词的起始字母匹配,则角度材料自动完成应显示选项

问题描述

第一个键入的字母应与下拉列表中结果的每个单词的第一个字母匹配。

目前我正在匹配选项中的任何字母,如下所示,但我应该只匹配选项中任何单词的起始字母。

我目前的逻辑如下,

返回 this.allUniversities.filter(university => university.toLowerCase().indexOf(filterValue) > -1);

如果列表中的条目是 Industrial Designer,则该条目应在候选人键入字母 I 或字母 D 时显示。如果候选人键入字母“N、D、U、S”等,则不应显示该条目。

标签: autocompleteangular-materialangular6

解决方案


您需要做的就是拆分字符串,然后检查子字符串是否以键入的字符开头:

return this.allUniversities.filter(university => {
    return university.toLowerCase().split(' ').some(substr => substr.startsWith(filterValue));
  });

是一个堆栈闪电战,展示了它的实际效果。


推荐阅读