2016-07-27 5 views
0

Lassen Sie uns sagen, dass ich die folgenden Daten haben asymmetrische AnordnungAccess-Objekte ohne Rohr oder ngfor in angular2

[{'name':'user','password':'123'},{'title':'officer','grade':'5','age':'5'}] 

von einem Ajax-Anforderung, die es abbildet

return this._http.get(url).map(res => res.json()); 

, und ich will es für den Zugriff in angular2 HTML-Vorlage, ich weiß direkt, was jeder Block entspricht und es ist technisch nicht ein Array, das Sie Schleife würden.

Gibt es eine Methode in Angular, um auf die Daten zuzugreifen, ohne eine Pipe oder ngFor zu verwenden?

zur Zeit verwende ich eine wirklich schmutzige Methode durch ngFor Schneiden Sie dann die Wörterbuchdaten mit

<div *ngFor="let i of element| slice:0:1"> 
<p> {{element.name}} </p> 
<p> {{element.pass}} </p> 
</div> 
<div *ngFor="let i of element| slice:1:2"> 
<p> {{element.title}}</p> 
... 

gibt es eine einfachere Art und Weise mit weniger Setup, dies zu tun, weil ich hundres von Ausnahmen halten zu begegnen und ich kann Finden Sie keine einfache, dokumentierte Möglichkeit, auf JSON-Objekte zuzugreifen, ohne das Overhead-Setup einzurichten?

Antwort

3

Sie müssen Nullwerte schützen, wenn Sie die Daten Asynchron

{{element && element[0].name}} 
{{element && element[0].pass}} 
{{element && element[1].title}} 
+0

ist diese anzuwenden erhalten [[{}] {}] Art von Struktur? mit {{element && element [0] [1] .title}} – Newbie

+0

und ja, diese Technik funktioniert auch, können Sie bitte die Dokumentation dafür erklären oder verlinken? – Newbie

+0

Nicht sicher, nach welcher Dokumentation Sie suchen. Das Problem ist, dass Angular versucht, diesen Bindungsausdruck aufzulösen, bevor die Daten von Ihrem asynchronen 'this._http.get()' ankommen. Der Code in meiner Antwort gibt nur 'null' zurück, wenn 'element'' null' ist und 'element [...] ....' andernfalls. Dies ist ein grundlegender JavaScript-Code. Nichts besonderes hier. '&&' ist kurzgeschlossen. Wenn 'element == null' ist, wird der Teil nach' && 'überhaupt nicht ausgewertet. –