我有一個類的物件。此物件正在從 API 獲取資料。在 HTML 中訪問此物件時，我收到錯誤 TS2532。這是代碼——
export interface TgtInfo{
Month: string;
SerTarget?: number;
IFCTarget?: number;
EmailTarget?: number;
PSFTarget?: number;
SMRTarget?: number;
SerAch?: number;
IFCAch?: number;
EmailAch?: number;
PSFAch?: number;
SMRAch?: number;
}
組件 TS 檔案
TGTData?: TgtInfo;
this.apiService.getTargetAchivement(this.searchObj).subscribe((data: any) => {
if(data){
this.TGTData = data ;
}
}, err => {
console.log(err);
});
組件 HTML 檔案
<h2>{{TGTData?.SMRTarget | number }}%</h2>
uj5u.com熱心網友回復：
你可以像這樣添加問號：
<h2>{{TGTData?.SMRTarget | number }}%</h2>
如果你想給它默認值，你可以這樣做：
<h2>{{TGTData?.SMRTarget | number || 0}}%</h2>
uj5u.com熱心網友回復：
錯誤代碼 TS2532 僅表示您的物件TGTData可能未定義 - 顯然這在您使用 api-data 時有意義。它被拋出是因為 angular 嘗試渲染視圖但沒有分配值TGTData
最優雅的解決方案是使用?角度模板語法中的運算子。在?停止評估，如果TGTData是null或undefined
您還可以使用 *ngIf 來包裝您的代碼塊，我不建議這樣做：
<h2 *ngIf="TGTData">{{TGTData.SMRTarget | number }}%</h2>
只是一個附帶問題，為什么你使用類而不是介面？
問候
簡
轉載請註明出處，本文鏈接：https://www.uj5u.com/caozuo/408142.html
標籤：