Angular2 Typescript, wie Objekteigenschaften in Vorlage angezeigt werden

Question

Ich lerne angle2 und Typoskript und frage mich, warum ich nicht auf Eigenschaftswerte des Objekts in meiner Vorlage zugreifen kann.

Meine Komponente:

export class Farm{ 

    data:JSON; 
    id: any; 

    constructor(private nextService: NextService, navParams: NavParams){ 
     this.id = navParams.get("param1"); 

    } 

    getFarmDetails(){ 

     this.data = this.nextService.fetchData(this.id) 
     console.log(this.data) 
    } 
} 

wo console.log (this.data) me Object {id: 1, name: "Leanne Graham", username: "Bret", email: "Sincere@april.biz", address: Object…}

In meiner Vorlage

Ich habe gibt

<div> 
    {{data}} 
</div> 

, die auf meinem Bildschirm ausgibt als [Objekt Objekt]

Wie kann ich stattdessen Eigenschaften wie E-Mail oder Benutzername ausgeben?

UPDATE: Wenn ich {{}} data.email mag ich folgende Fehlermeldung erhalten:

Answer 1

Sie können diese Eigenschaften zugreifen, wie Sie es in Javascript.

Zum Beispiel:

{{data.email}} 

Wenn die Daten abgerufen werden asynchron können Sie den Operator elvis verwenden ?., um die Fehler zu vermeiden, während Daten null sind.

{{data?.email}}