我有一個資料型別：
export interface TYPE_A {
valueType: TYPE_A_VALUE_TYPES;
value: string | string[];
}
export enum TYPE_A_VALUE_TYPES {
singleValue = "singleValue",
multiValue = "multiValue",
}
而且，我TYPE_A在組件中使用@Input：
@Input() datas: TYPE_A[] = [];
這是我的 HTML 代碼：
<div class="feildContainer" *ngFor="let data of datas">
<div class="singleFeild" *ngIf="data.valueType == 'singleValue'">
...
</div>
<div class="multiFeild" *ngIf="data.valueType == 'multiValue'">
<other-component *ngFor="let dataValue of data.value"></other-component>
<div>
</div>
我收到此錯誤vscode：
NgForOf<string | string[], NgIterable<string | string[]>>.ngForOf: NgIterable<string | string[]> | null | undefined
我理解這個錯誤的邏輯，但我正在尋找這個問題的最佳解決方案。
uj5u.com熱心網友回復：
使用有區別的聯合作為你的型別：
export interface TYPE_A_SINGLEVALUE {
valueType: TYPE_A_VALUE_TYPES.singleValue;
value: string;
}
export interface TYPE_A_MULTIVALUE {
valueType: TYPE_A_VALUE_TYPES.multiValue;
value: string[];
}
export enum TYPE_A_VALUE_TYPES {
singleValue = "singleValue",
multiValue = "multiValue",
}
然后，當您想要使用該value專案時，您首先檢查valueType兩個可能值之一，編譯器將知道您想要參考單值或多值專案并相應地假設。在ifof之后valueType value不會是string | string[]，而是string或被string[]選中。
uj5u.com熱心網友回復：
<other-component *ngFor="let dataValue of $any(data.value)"></other-component>
這會洗掉變數的型別。當您無法正確推斷變數的型別時，可以在 HTML 中使用它。
轉載請註明出處，本文鏈接：https://www.uj5u.com/ruanti/480871.html
上一篇：如何自動將逗號轉換為點？
下一篇：漢堡選單中的滑動添加水平滾動條