angular2 NgFor nur unterstützt zu Iterables wie Arrays Bindung

Question

Angular2 rc.6

Ich erhalte Fehler, wenn Ihr eine Schleife auf json Daten

core.umd.js läuft: 5995 AUSNAHME: Fehler in app/modules/mbs/components/menu.html: 5: 4 verursacht durch: Kann kein unterstützendes Objekt '[object Object]' vom Typ 'object' finden. NgFor unterstützt nur die Bindung an Iterables wie Arrays.

meine HTML-Schleife, Hinweis: Ich möchte einfach Eigenschaften und Arrays in der Antwort zu iterieren.

<li *ngFor="let item of menuItems"> 
{{item}} 
</li> 

meine Service-Methode

getMenuItems():Promise<any>{ 
    return this.http.get('api/menu').toPromise(). 
    then(response => response.json()) 
     .catch(this.handleError) 

} 

finden meine Json Antwort

{ "text": "Menu", "children": [ { "text": "Home", "url": "/spatt-web/home" }, { "text": "Configure", "children": [ { "text": "Tri-Party Program", "children": [ { "text": "Margins and Filters", "url": "/sp-rrp/config/operation" }, { "text": "Fields and Desirability", "url": "/spatt-rrp/config/program" } ] }, { "text": "Shared Settings", "url": "/shared-config/config" }, { "text": "SOMA Limits", "url": "/outright-config/config" } ] }, { "text": "Plan", "children": [ { "text": "Tri-Party RRP Operations", "url": "/spatt-rrp/plan" } ] }, { "text": "Track" }, { "text": "Administer" }, { "text": "Help", "children": [ { "text": "RRP Operations", "url": "RRPference" }, { "text": "RRP Margin Calls and Recalls", "url": "RRPRecallference" } ] } ] } 

Answer 1

Es ist wie Sie

wollen

<li *ngFor="let item of menuItems.children"> 
{{item}} 
</li>