首页 > 解决方案 > 清除搜索文本后突出显示管道不会消失

问题描述

我正在使用我找到的这个示例代码来创建管道以突出显示垫自动完成中的搜索文本。突出显示的部分工作正常,但是一旦我清除搜索,突出显示仍然保留在下拉列表中。这不是预期的行为。清除搜索后,我希望突出显示消失。

请帮我解决这个问题。

标签: angularangular-materialpipe

解决方案


你可以改变你的构造函数,我认为下面的代码会帮助你

 constructor() {
    this.stateCtrl = new FormControl();
    this.filteredStates = this.stateCtrl.valueChanges
      .pipe(
        startWith(''),
        map(state => this.filterStates(state))
      );
  }

  filterStates(name: string) {
    this.toHighlight = name;
    return this.states.filter(state =>
      state.name.toLowerCase().indexOf(name.toLowerCase()) === 0);
  }

演示


推荐阅读