angular - 如何在 Angular 模板中迭代联合类型数组

Question

我是 Angular 的新手，开始研究版本 12，但我陷入了困境。在哪里我想在模板中迭代我的联合数组，但它给我错误。

错误:输入 'IBasketItem[] | IOrderItem[]' 不可分配给类型 'NgIterable'。

这是我要迭代的组件中的联合数组。

@Input() items: IBasketItem[] | IOrderItem[] = [];

这是模板代码

<tr *ngFor="let item of items" class="border-0">

它在“of”关键字下给我一条红线，上面提到的错误

这里是 IBasketItem 接口(interface)

export interface IBasketItem {
id: number;
productName: string;
price: number;
quantity: number;
pictureUrl: string;
brand: string;
type: string;

这是 IOrderItem 接口(interface)

export interface IOrderItem {
productId: number;
productName: string;
pictureUrl: string;
price: number;
quantity: number;

如果有人提出解决方案，我将不胜感激。

Answer 1

Angular 检查应用程序代码中模板中的表达式和绑定(bind)。尝试在 tsconfig.json 文件中设置 "strictTemplates": false，应该没问题。