在 Angular 5 和 AOT-Build 中使用 @angular 编译器时出错答案

【问题标题】：Error while using @angular compiler in Angular 5 and AOT-Build在 Angular 5 和 AOT-Build 中使用 @angular 编译器时出错
【发布时间】：2018-06-28 14:24:43
【问题描述】：

我正在使用 Angular 编译器在运行时编译组件。此代码工作正常，但如果我想使用 AOT-Prerendering 组件将无法工作，因为 Angular 不会在 AOT-Build 中加载编译器。

我已经阅读了一些不再适用于 Angular5+ 的解决方法。你有解决这个问题的办法吗？

最好的问候

导出类 RuntimeCompilerComponent { 模板：字符串=“”； @ViewChild('dynamicComponent', { read: ViewContainerRef }) 容器：ViewContainerRef; 构造函数（私有编译器：编译器）{ } //Ruft die addComponent Methode auf 创建组件（）{ this.addComponent(this.template, null); } // Komponente wird dynamisch erzeugt und geladen // Sollten sich die properties ändern muss ggf. die Changedetection manuell aufgerufen werden。私人添加组件（模板：字符串，属性：任何= {}）{ @组件（{模板}）类模板组件 { } @NgModule({ 进口：[ 应用模块，通用模块，反应形式模块，表单模块，浏览器模块， ]，声明：[模板组件] }) 类模板模块 { } const mod = this.compiler.compileModuleAndAllComponentsSync(TemplateModule); 常量工厂 = mod.componentFactories.find((comp) => comp.componentType === TemplateComponent ); 常量组件 = this.container.createComponent(factory); Object.assign(component.instance, properties); } }

【问题讨论】：

标签： runtime angular5 aot

【解决方案1】：

您可以通过一些技巧来完成这项工作。去年我遇到了同样的问题，并且能够找到解决方法。我在样式指南中使用了动态生成的角度组件。这是一个工作示例，它适用于 Angular 7 中的 AOT 编译：

https://github.com/johncrim/angular-dynamic-styleguide

该项目的 README.md 提供了一些关于我遇到的问题以及我如何解决问题的附加信息。

【讨论】：