如何解决PrimeNg multiselect返回空值
我有一个通过API调用获取的json:
tmp
我声明了以下变量:
[
{
"CategoryID": "1","CategoryName": "cat1","DocDescription": "cat1 description","Indexes": [
{
"IndexID": "1","IndexName": "id1name",},{
"IndexID": "2","IndexName": "id2name",{
"IndexID": "3","IndexName": "id3name",}..
]
}...
]
我的电话是:
categoriesResponseModel: CategoriesResponseModel;
categories: CategoryModel[] = [];
category: CategoryModel;
@Output() selectedCategories = new EventEmitter<CategoryModel[]>();
我尝试使用PrimeNg在多选择输入中显示结果:
private getCategories(): void {
const response = this.apiService.getCategories().subscribe(
(res) => {
this.categoriesResponseModel = JSON.parse(res);
for (const category of this.categoriesResponseModel.CATEGORIES) {
this.categories.push(category);
}
},(err) => { console.log(err.message); },() => { console.log('Completed - Categories pushed'); }
);
}
我确实使用{{类别| json}},在我的模板中也显示了多选功能,但无法正常工作
解决方法
感谢Hassan和PrimeNg文档,它可以完美运行。 我终于使用了模板化版本:
<p-multiSelect
[options]="categories"
[(ngModel)]="selectedCategories"
defaultLabel="Select a Category"
optionLabel="CategoryName"
class="multiselect-custom">
<ng-template let-value pTemplate="selectedItems">
<div class="itemlist itemlist-value" *ngFor="let option of selectedCategories">
<div>{{option.CategoryName }}</div>
</div>
<div *ngIf="!selectedCategories || selectedCategories.length === 0" class="country-placeholder">
Select categories
</div>
</ng-template>
<ng-template let-category pTemplate="item">
<div class="itemlist">
<div>{{category.value.CategoryName }}</div>
</div>
</ng-template>
</p-multiSelect>
我遇到同样的问题,因为我试图显示:
{{category.CategoryName }}
代替
{{category.value.CategoryName }}
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。