实现 Angular 动态组件的问题 - AOT 和变更检测

如何解决实现 Angular 动态组件的问题 - AOT 和变更检测

我正在尝试实现一个 Angular 库，它将封装将动态组件添加到 DOM 所需的逻辑。必须允许使用此库的应用程序提供动态组件列表，然后定义必须在运行时插入这些动态组件的“出口”。

我的代码深受两篇文章的启发：

• Max Koretskyi 的第一个：https://indepth.dev/posts/1054/here-is-what-you-need-to-know-about-dynamic-components-in-angular
• Wes Grimes 的第二个：https://itnext.io/building-an-aot-friendly-dynamic-content-outlet-in-angular-c2790195cb94

我的代码的基本结构如下：

• 带有模块 ng-dynamic-components 的库 NgDynamicComponentsModule，它允许使用者定义可在运行时添加到 DOM 的组件列表
• 维护此类动态组件及其组件工厂的注册表的服务，用于在需要时实例化组件
• 一个插座组件，它使用 ViewContainerRef 处理实际将动态组件放入 DOM 的逻辑
• 一个 dynamic-test-app，它导入这个库并使用一些动态注入的测试组件来使用它——OneComponent、TwoComponent 和 ThreeComponent

我的代码位于：https://github.com/kiranjholla/ng-dynamic-components。要运行我的代码，只需克隆这个 Git 存储库，然后输入 npm install 和 npm start。这将首先使用选项 --prod 构建库，然后使用选项 --prod --aot=false --buildOptimizer=false 构建测试应用程序，然后启动一个 http-server 实例来为 dist 文件夹提供服务

现在我的问题是：上述代码仅在应用程序使用 --aot=false --buildOtimizer=false 构建时才有效；启用 AOT 后，我收到一条错误消息，指出编译器不可用。

但是，我已经提供了专门使用 JitCompilerFactory 的编译器。我怎样才能让它与 AOT 一起工作？

任何帮助/指示，非常感谢。