angular - NgSwitch 还是 ComponentFactoryResolver？

Question

我正在编写一个列出一些用户并在单击用户时显示信息页面的应用程序。用户类型不同(约 20 种)，详细信息页面在布局和功能上因用户类型而异。

我有一个主 DetailsComponent 和 20 个必须显示在主 中的特定组件(Type1DetailsComponent、Type2DetailsComponent 等) >DetailsComponent.

我想到了两种实现方式:

1. 在DetailsComponent中使用NgSwitch来选择具体的组件
2. 使用 ComponentFactoryResolver 和 ViewContainerRef 创建所需的特定组件并将其显示在 DetailsComponent 中

第一种方法要求所有 SpecificDetailsComponent 都列在 NgSwitch 中，降低了可扩展性。

第二种方法似乎更好，但它有一些缺点:

• 需要一个目标元素来放置动态创建的组件。新组件不能替换目标元素，而是放在它之后。这看起来很困惑。
• 在创建组件时，@Input 和@Output 不会由 Angular 自动设置。

我可以做些什么来改进第二种方法吗？

有没有更好的实现目标的方法？

Answer 1

我相信目标元素确实被替换了，但无论哪种方式，如果没有替换，它都只是一个错误的元素。我认为即使组件很复杂，CFR 也会快 50%。