angular - 为什么primeng Autocomplete不能按预期工作并且不报告错误?
问题描述
我正在使用primeng的自动完成,然后是启动示例(最新版本)。
但什么也没发生。我输入:“au”,但它没有完成,也没有报告错误。可能是什么问题呢?
<p-autoComplete [(ngModel)]="brand" [suggestions]="brands" [size]="30" [dropdown]="true">
<ng-template let-brand pTemplate="item">
<div class="ui-helper-clearfix" style="border-bottom:1px solid #D5D5D5">
<div style="border:1px solid red;font-size:18px;">{{brand | json}}</div>
</div>
</ng-template>
</p-autoComplete>
{{brand | json}}
brands = [
{ id: 1, name: "audi" },
{ id: 2, name: "BMW" },
{ id: 3, name: "Fiat" },
{ id: 4, name: "Ford" },
{ id: 5, name: "Honda" },
{ id: 6, name: "Jaguar" },
{ id: 7, name: "Mercedes" },
{ id: 8, name: "Renault" },
{ id: 9, name: "Volvo" },
{ id: 10, name: "VW" }
];
brand: string;
我在这里想念什么?
解决方案
组件代码:
name = 'Angular';
brands: string[] = ['Audi', 'BMW', 'Fiat', 'Ford', 'Honda', 'Jaguar', 'Mercedes', 'Renault', 'Volvo', 'VW'];
filteredBrands: any[];
brand: string;
filterBrands(event) {
this.filteredBrands = [];
for(let i = 0; i < this.brands.length; i++) {
let brand = this.brands[i];
if(brand.toLowerCase().indexOf(event.query.toLowerCase()) == 0) {
this.filteredBrands.push(brand);
}
}
}
HTML 代码:
<p-autoComplete [(ngModel)]="brand" [suggestions]="filteredBrands" (completeMethod)="filterBrands($event)" [size]="30"
[minLength]="1" placeholder="Hint: type 'v' or 'f'" [dropdown]="true">
<ng-template let-brand pTemplate="item">
<div class="ui-helper-clearfix" style="border-bottom:1px solid #D5D5D5">
<img src="assets/showcase/images/demo/car/{{brand}}.png" style="width:32px;display:inline-block;margin:5px 0 2px 5px"/>
<div style="font-size:18px;float:right;margin:10px 10px 0 0">{{brand}}</div>
</div>
</ng-template>
</p-autoComplete>
<span style="margin-left:50px">Brand: {{brand||'none'}}</span>
推荐阅读
- android - 如何预下载 HERE 地图图块以供离线使用
- php - 使用 .htaccess 为多语言站点重写 URL(多个变量)
- r - r - 在列表的任何元素中查找字符串,然后使用该列表元素的名称
- haskell - Haskell中的函数类型签名而不使用解释器
- c++ - 将复杂参数列表与类模板一起使用
- java - 在 Java 中设置不同的驻留堆大小和总换出的虚拟内存大小
- structured-data - Google结构化数据测试工具和微格式hcard的问题
- html - 找不到 Django 全局静态文件
- java - 您将如何重构 Arrays.copyOf() 方法以删除 @SuppressWarnings("unchecked") 注释?
- java - 警报对话框仅模糊部分屏幕