打字稿鑄造JSON來在角對象使用`as`不起作用

角tutorial具有在HTTP部分下面的行：打字稿鑄造JSON來在角對象使用`as`不起作用

response => response.json().data as Hero

得到時英雄。 response.json().data返回以下內容：

我試圖做同樣的事情。我在服務器端使用Django並使用rest_framework返回json。在角我有我的課：

export class MyClass { 
    name: string; 
}

response.json()從服務器返回查找方式如下：

所以我嘗試做的是：

myObject: MyClass; 

ngOnInit(): void { 
    this.getResponseFromServer().then(myObject => this.myObject = myObject); 
} 

getResponseFromServer(): Promise<MyClass> { 
    return this.http.get("http://127.0.0.1:8000/myurl/") 
     .toPromise() 
     .then(response => response.json() as MyClass) 
     .catch(this.handleError); 
}

和我的模板包含：

<ion-card> 
    <ion-card-header> Card Header </ion-card-header> 
    <ion-card-content> 
     Response from server {{myObject.name}} 
    </ion-card-content> 
</ion-card>

我收到錯誤：無法讀取未定義的屬性「名稱」。

當我在HTML {{myObject.name}}更改爲{{myObject}}，那麼就沒有錯誤，並從服務器的應答，我必須從服務器[對象的對象]印刷響應。

所以問題是我的代碼和角度教程有什麼區別？我已經看到很多回答問題，比如How do I initialize a typescript object with a JSON object，但是我希望它只需使用as關鍵字就容易多了。

來源

2017-04-20 bdshadow

請閱讀標籤說明，不使用角2+問題angularjs標籤。 – estus

這與TypeScript無關。

Error: Cannot read property 'name' of undefined.

是運行時錯誤。

從引導的示例使用指令作爲保障措施：

<div *ngIf="hero"> 
    <h2>{{hero.name}} details!</h2> 
    ... 
</div>

和

<a *ngFor="let hero of heroes" ...> 
    <div class="module hero"> 
     <h4>{{hero.name}}</h4> 
    </div> 
    </a>

雖然上面的代碼沒有。

當myObject是原本undefined，沒有什麼阻止由編譯器解析{{myObject.name}}表達，因此錯誤。 Safe navigator operator（被稱爲貓王運營商）應該用來避免這種情況：

{{myObject?.name}}

來源

2017-04-20 13:13:30 estus

打字稿鑄造JSON來在角對象使用`as`不起作用

回答

相關問題