要实现无按钮的p-autocomplete下拉菜单,你可以按照以下步骤进行:
安装Angular和Primeng库,并将其添加到你的项目中。
创建一个Angular组件,命名为AutocompleteComponent(或其他你喜欢的名称)。
在AutocompleteComponent的HTML模板中,添加一个input元素,并使用p-autocomplete指令将其转换为自动完成输入框。确保将[(ngModel)]绑定到一个变量,以便可以获取用户输入的值。
selectedValue: string;
filteredValues: string[];
constructor() {
this.filteredValues = [];
}
filterValues(event) {
// 这里假设你的建议值存储在一个数组中,命名为values
this.filteredValues = this.values.filter(value => {
return value.toLowerCase().includes(event.query.toLowerCase());
});
}
通过按照以上步骤进行操作,你就可以实现一个无按钮的p-autocomplete下拉菜单。用户输入值后,会自动过滤建议值,并将选择的值存储在selectedValue变量中。
上一篇:Angular/Prime NG的输入绑定到一个对象时,显示为[object object],如何在界面上显示对象的字段?
下一篇:Angular/PrimeNG-regexkeyFilterwithadditionalrestrictionofinputvalues