AngularMaterial无法过滤选项
创始人
2024-10-28 11:01:45
0
  1. 确认使用的版本是否支持过滤功能。在使用mat-select时,需要在module中导入MatSelectModule,并且设置formControl属性,如下所示:
import { MatSelectModule } from '@angular/material/select';
import { ReactiveFormsModule } from '@angular/forms';

@NgModule({
 imports: [
   ReactiveFormsModule,
   MatSelectModule
 ],
 declarations: [AppComponent],
 bootstrap: [AppComponent]
})
export class AppModule { }
  1. 确认是否正确使用matAutocomplete指令。例如,如果要过滤mat-option选项,请确保您已经将matAutocomplete指令添加到input元素上,如下所示:

  
  
    
      {{option}}
    
  

  1. 确认过滤条件是否正确。您可以根据需要过滤选项,例如根据输入的文本过滤选项,如下所示:
ngOnInit() {
 this.filteredOptions = this.myControl.valueChanges
   .pipe(
     startWith(''),
     map(value => this.filter(value))
   );
}

filter(value: string): string[] {
 const filterValue = value.toLowerCase();
 return this.options.filter(option => option.toLowerCase().includes(filterValue));
}

以上是解决Angular Material无法过滤选项的方法。

相关内容

热门资讯

第2分钟辅助!pokemmo脚... 第2分钟辅助!pokemmo脚本,hhpoker可以控制牌吗,经验教程(果真有挂)1、hhpoker...
第1分钟辅助!wepoker私... 第1分钟辅助!wepoker私人局怎么玩,佛手在线大菠萝智能辅助器,资料教程(有挂神器)所有人都在同...
六分钟辅助!hhpoker德州... 六分钟辅助!hhpoker德州透视挂,wepokerplus透视脚本免费,指南教程(有挂方式)运we...
6分钟辅助!hhpoker软件... 6分钟辅助!hhpoker软件安装包,wepoker免费脚本弱密码,总结教程(有挂分析)1)wepo...
第五分钟辅助!aapoker插... 第五分钟辅助!aapoker插件下载,wepoker有辅助器吗,大纲教程(有挂工具)1、完成wepo...
第4分钟辅助!wepoker永... 第4分钟辅助!wepoker永久免费脚本,wepoker买钻石有用吗,绝活教程(有挂方针)1、下载好...
八分钟辅助!wpk作弊,wep... 八分钟辅助!wpk作弊,wepokerplus辅助,法门教程(有挂神器)1、wepokerplus辅...
七分钟辅助!wepoker私局... 七分钟辅助!wepoker私局辅助,hhpoker辅助器视频,经验教程(有挂教学)该软件可以轻松地帮...
第3分钟辅助!wepokerp... 第3分钟辅助!wepokerplus开挂,we poker游戏下,步骤教程(有挂讲解)1、wepok...
第5分钟辅助!poker辅助器... 第5分钟辅助!poker辅助器免费安装,epoker有透视吗,方案教程(真实有挂)1、游戏颠覆性的策...