如何使用 jQuery 自动完成功能搜索特定记录，忽略在输入框中输入的顺序词

Question

我在我的 Angular 2 rc4 中使用 jQuery autocomplete。

我的 HTML <input class="search" id="search-input" type="text" name="search-input" placeholder="Search by keyword, lesson or standard" #searchResult1 [(ngModel)]="completeMe"/>

在 .ts 文件中

heroes:any=[];
this.heroes.push(
{
    "id": "1",
    "label": "This is example text"
});
 this.heroes.push(
{
    "id": "2",
    "label": "This is result text"
});
jQuery('#search-input')
  .autocomplete({
    source:this.heroes,
    minLength: 2,
 });

结果：：当我在 i/p 框中输入"这是"时，两个结果都将附加到 li 标签中。当我输入"此结果"时，LI 标签中不会显示或附加任何内容。

预期成果 ：当我输入"此结果"或"结果此"时，它应该在li标签中附加"这是结果文本"，而忽略输入文本的顺序。

目前，它仅呈现与句子完全匹配的内容。 但我想忽略单词的顺序。

请帮忙。

Answer 1

这样的事情应该这样做：

jQuery('#search-input')
  .autocomplete({
    source: (request, response) => {
      const val = '^(?=.*\b' + request.term.trim().split(/s+/).join('\b)(?=.*\b') + ').*$'
      const matcher = RegExp(val, 'i')
      response(this.heroes.filter(item => matcher.test(item.label)));
    },
    minLength: 2,
  });

另请注意，您不应该使用 jQuery('#search-input') ，请考虑在此组件中使用相应组件或查询 DOM 的elementRef.nativeElement，但不要像现在这样全局使用。