根据其类型将扩展接口绑定到组件的最佳方法是什么？
我正在将旧的 AngularJs 应用程序迁移到 Angular 12，并且在想出解决继承问题的好方法时遇到一些问题。
它基本上是一个构建用户界面的编辑器，具有自定义组件，例如表单、组、行等。
每个组件都有一个自己类型的@Input，例如，group 采用“group”类型。
所有各种类型的元素都存储在 ElemBase 类型的单个元素数组中。我的目标是写这样的东西：
<div *ngFor="let elem of elems">
<app-group *ngIf="elem is Group" [elem]="elem"></app-group>
<app-row *ngIf="elem is Row" [elem]="elem"></app-row>
<app-button *ngIf="elem is Button" [elem]="elem"></app-button>
</div>
你们可爱的人们对如何实现这一目标有什么建议吗？ 我尝试过使用联合类型，例如元素：Array
提前致谢， 祝你今天过得愉快！
I'm migrating an old AngularJs app to Angular 12, and am having some problems coming up with a good approach to solve a problem with inheritance.
It's basically an editor to build a user interface, with custom components such as form, group, row, etc.
Each component has an @Input of its own type, for example, group takes a "group" type.<app-group [elem]=elem> </app-group>, where elem in this case is of type Group. All of these types extend the type ElemBase.
All of the elements of various types are stored in a single elements array, of type ElemBase. My goal is to write something like this:
<div *ngFor="let elem of elems">
<app-group *ngIf="elem is Group" [elem]="elem"></app-group>
<app-row *ngIf="elem is Row" [elem]="elem"></app-row>
<app-button *ngIf="elem is Button" [elem]="elem"></app-button>
</div>
Do you lovely people of SO have any recommendations on how to achieve this?
I have tried using a union type such as elements: Array<Group | Row | Button...>, which does not work when binding into each subcomponent.
Thanks in advance,
Have a nice day!
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论