[英]Loop over object Ionic3/Angular4
我正在嘗試遍歷內容。 我嘗試了一些在StackOverflow中找到的答案,但沒有一個適合我。
我有這個JSON
{
"-KmdNgomUUnfV8fkzne_":{
"name":"Abastecimento"
},
"-KmdNgzguGKbCEfyQ3F0":{
"name":"Consórcios"
},
"-KmdNh9_jtBlFqY1Y_Rj":{
"name":"Consultoria aeronáutica"
},
"-KmdNhKNCVEiJ2Ou8bUV":{
"name":"Cursos e treinamentos"
},
"-KmdNhVRoKfaCM--304M":{
"name":"Financiamento"
},
"-KmdNhfIC6fA0kDJcVBq":{
"name":"Hangaragem"
},
"-KmdNhu0X-PteQMyHp_n":{
"name":"Mecânica"
},
"-KmdNi6ZmmYXnoOTXoC5":{
"name":"Táxi Aéreo"
},
"-KmdNiHFhiX_crXB1L2R":{
"name":"Outros"
}
}
我正在嘗試循環使用此代碼
<button ion-item *ngFor="let cat of subcategories" (click)="onSubcategorySelect(cat)">
{{ cat.name }}
</button>
沒用 我究竟做錯了什么?
Angular的ng-for
需要具有Iterable
接口的任何元素才能工作,而普通Object並非如此。 您需要在數組中“轉換”該對象,更簡單的方法是使用forEach
或for/in
循環:
在代碼中的任何位置,您都將遍歷對象,並將其保存在要在ngFor
使用的新變量中:
public newSubcategories: any[] = []; // DECLARE A NEW EMPTY ARRAY IN THE TOP OF YOUR CLASS
this.subcategories.forEach(item => {
this.newSubcategories.push(a);
});
如果需要維護密鑰,請使用for/in
來用密鑰推送新對象。
public newSubcategories: any[] = []; // DECLARE A NEW EMPTY ARRAY IN THE TOP OF YOUR CLASS
for(let key in this.subcategories){
this.newSubcategories.push({
key: key,
name: this.subcategories[key].name
});
}
最后你的HTML
<button ion-item *ngFor="let cat of newSubcategories" (click)="onSubcategorySelect(cat)">
{{ cat.name }}
</button>
有了這個,您就可以在新數組中使用ng-for
了。
希望這可以幫助。
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.