循環播放對象Ionic3/Angular4

我試圖遍歷內容。我嘗試了一些在StackOverflow中找到的答案，但沒有一個適合我。循環播放對象Ionic3/Angular4

我有這樣的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" 
    } 
}

I'm使用此代碼

<button ion-item *ngFor="let cat of subcategories" (click)="onSubcategorySelect(cat)"> 
       {{ cat.name }} 
</button>

它不工作試圖循環。我究竟做錯了什麼？

來源

2017-10-16 Andre Pavini

看看這個 - https://stackoverflow.com/questions/41396435/how-to-iterate-object-object-using-ngfor-in-angular-2 –

角的ng-for需要的任何元素與Iterable接口工作，它不是一個普通的物體的情況下。你需要在一個數組「轉換」這個對象中，更簡單的方法是用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。

希望這會有所幫助。

來源

2017-10-16 18:18:33

循環播放對象Ionic3/Angular4

回答

相關問題