Angular 2: {{Objekt}} funktioniert, {{object.child}} löst einen Fehler aus

7

Seit einiger Zeit arbeiten wir mit Angular v1 und seitdem Angular v2 in die Beta gekommen ist, haben wir damit herumgespielt.

Jetzt habe ich dieses Stück Code, aber ich kann es nicht zur Arbeit bringen, ich weiß wirklich nicht warum. Irgendwie funktioniert alles, wenn ich {{profileUser | json}} drucke (profileUser ist ein Objekt).

Wenn ich jedoch ein untergeordnetes Objekt dieses Objekts drucken möchte (z. B. {{profileUser.name}} oder {{profileUser.name.firstName}} ), wird von Angular der folgende Fehler ausgegeben:

EXEPTION: TypeError: undefined is not an object (evaluating 'l_profileUser0.name') in [ {{profileUser.name}} in ProfileComponent@4:11 .

Es ist wirklich verwirrend für mich, sollte nur eines der einfachsten Dinge sein. Gerade erst mit TypeScript btw ..

begonnen

Hier ist ein Code - ProfileService.ts :

%Vor%

Und hier ist mein ProfileComponent :

%Vor%

Schließlich die Vorlage profile.html :

%Vor%

oder ..

%Vor%

oder ..

%Vor%

FYI, der Profilbenutzer sieht folgendermaßen aus:

%Vor%

Wäre toll, wenn mir jemand helfen könnte, das hält mich wirklich zurück, um mich mit Angular v2 vertraut zu machen. Danke!

    
Aico Klein Ovink 24.12.2015, 16:30
quelle

2 Antworten

21

Tatsächlich wird Ihr profileUser -Objekt von einer HTTP-Anfrage geladen und es kann null am Anfang sein. Das json pipe macht einfach ein JSON.stringify .

Es ist, was Ihre Fehlermeldung sagte: undefined is not an object (evaluating 'l_profileUser0.name') .

Sie müssen sicherstellen, dass das Objekt profileUser nicht null ist, um das Attribut name usw. abzurufen. Dies kann mithilfe einer *ngIf -Direktive erfolgen:

%Vor%

Wenn die Daten vorhanden sind, wird der HTML-Block angezeigt.

Als Eric sagte, der Elvis-Operator könnte Ihnen auch helfen. Anstatt {{profileUser.name | json}} zu verwenden, könnten Sie {{profileUser?.name | json}} verwenden.

Hoffe es hilft dir, Thierry

    
Thierry Templier 24.12.2015, 16:49
quelle
3

Es passiert, weil der profileUser nicht definiert ist, wenn Ihr Controller erstellt wird. Und wenn Sie {{profileUser | json}} verwenden, weiß der Filter json , dass Ihre Daten nicht definiert sind und nichts tun. Wenn die profileUser endlich definiert ist, aktualisiert die eckige Aktualisierung die ganze Sache und dann profileUser | json . Wenn Sie jedoch {{ profileUser.anything | json}} verwenden, erhalten Sie einen Fehler, weil profileUser undefined startet.

Sie können es lösen und ein leeres Profil auf Ihre Variable am Anfang Ihres Controllers setzen, einfach so:

%Vor%

Auf diese Weise wird profileUser niemals undefined

sein     
robsonrosa 24.12.2015 16:49
quelle