要解决Angular Material自动完成不显示列表框的选项的问题,你可以尝试以下方法:
确保你已经正确导入了MatAutocompleteModule
和MatInputModule
模块。
确保你已经正确设置了自动完成的输入字段和自动完成的选项。
{{ option }}
// 在你的组件中
import { Component } from '@angular/core';
@Component({
selector: 'app-your-component',
templateUrl: 'your-component.html',
styleUrls: ['your-component.css'],
})
export class YourComponent {
options = ['选项1', '选项2', '选项3'];
selectedOption = '';
filterOptions(event: any) {
const filterValue = event.target.value.toLowerCase();
this.options = ['选项1', '选项2', '选项3'].filter(option =>
option.toLowerCase().includes(filterValue)
);
}
}
keyup
事件,调用了过滤选项的方法。
{{ option }}
通过以上方法,你应该能够解决Angular Material自动完成不显示列表框的选项的问题,并正确显示选项列表。