Angular 角度/Typescript@Output与Union返回类型

我有许多组件（模式窗口），可以让您从数据库的分页记录列表中进行选择。因此有一个

课程.select.component.ts

，用于选择课程

模式还采用一个

@Input（）multiple:boolean

属性，该属性确定它将返回单个课程还是多个课程。所以发射器是：

 @Output() courseChange = new EventEmitter<Course | Course[]>();

当我按如下方式绑定到选择器时会发生这种情况：

 <course-selector [(course)]="training.course" multiple="false" />

以及：

换句话说，

training.courseId

是一个字符串，但理论上返回的值可能是一个

string | string[]

，但编译器（使用

--prod

）不会抱怨这个问题

---

有没有简单的方法可以在不重写所有组件的情况下解决这个问题？

我怀疑问题在于最初的“training.course”被定义为一门课程，而不是一门课程。courseId工作的原因是writeValue方法接受联合类型，但training.course字段本身可能仅定义为单一类型，而不是联合类型。

您正在现场-training.course是数据库中的外键关系，即单一类型。然而，这在编译器中过去是正常的。因此，我似乎必须重新构建我的所有模型，使其具有两个EventEmitter（

courseChange

和

courseChange

）和两个输入属性（

@Input region

和

@Input regions

）。我希望有另一种方法可以在视图上投射类型或其他东西。你应该仍然能够使用一个事件发射器。只需更新“training.course”的类型就足够了，或者你可以使用一些中间逻辑将项目转换为一个大小相同的数组（如果它不是数组）或类似的数组。是的，我不能做第一个选项，因为模型是从数据库生成的。可能需要研究选项2。不确定这将如何工作，因为它是模板中的双向绑定：

[（课程）]=“model.xxx”

。一个选项是删除双向绑定并使用单独的输入/输出绑定。在输出绑定中，您可以在其前面放置一个函数来执行所需的任何映射。

 <course-selector [(course)]="training.course" multiple="false" />

 <course-selector [(course)]="training.course" multiple="false" [(ngModel)]="training.courseId" />

writeValue(courseId: string | string[]): void {
    if (courseId !== undefined) {
        this.courseId = courseId;
        this.propagateChange(this.courseId);
    }
}