使用角度从选项下拉列表中过滤/搜索

Question

我有带有复选框和下拉列表选项的多选下拉菜单。我想对下拉选项实现运行时/动态过滤搜索。我能够实现过滤搜索，但不能在运行时实现。

this.options = [{ value: "Small", selected: false },
        { value: "Medium", selected: false},
        { value: "Large", selected: false }]

filterUsers() {
        let filterUsers= this.options.filter(item => item.value === this.selectedUser);
        if (filterUsers.length > 0) {
            this.options = filterUsers;
        }
 }    
        console.log(filterUsers);
    }

HTML

<input type = "text" [(ngModel)]="selectedUser" (input) = "filterUsers()">

如何实现动态过滤搜索？

Answer 1

尝试这样：

  options = [
    { value: "Small", selected: false },
    { value: "Medium", selected: false },
    { value: "Large", selected: false }
  ];

  selectedUser: any;
  filterdOptions = [];
  filterUsers() {
    this.filterdOptions = this.options.filter(
      item => item.value.toLowerCase().includes(this.selectedUser.toLowerCase())
    );
    console.log(this.filterdOptions);
  }

演示

如果您开始输入sm，过滤后的选项将显示具有值的对象Small