角度自动完成搜索

Question

我有一个下拉列表，可以获取一些json数据。我正在这样做。因此，这里有一个名为options的列表，其中数据为json格式。因此，我必须在下拉菜单中显示名称字段。因此，我的任务是对该下拉菜单进行自动完成搜索。我在此处附加了stackblitz链接。

Answer 1

您需要将过滤器方法固定为：

  private _filter(value: any): any {
    const filterValue = value.toLowerCase();

    return this.options.filter(option =>
      option.name.toLowerCase().includes(filterValue)
    );
  }

这里是demo code

Answer 2

您正在将一个对象与过滤器值进行比较。

您的过滤器回调函数应该是这样的。

option => option.name.toLowerCase().includes(filterValue)

Answer 3

它解决了您的问题。

 return this.options.filter(option => option.name.toLowerCase().indexOf(filterValue) === 0);