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

Question

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

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

最好的祝福

导出类 RuntimeCompilerComponent {
模板:字符串=“”；
@ViewChild('dynamicComponent', { read: ViewContainerRef }) 容器:ViewContainerRef;
构造函数(私有(private)编译器:编译器){ }

//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。
私有(private)添加组件(模板:字符串，属性:任何= {}){
@组件({模板})
类模板组件 { }
@NgModule({
进口:[
应用模块，
通用模块，
react 形式模块，
表单模块，
浏览器模块，
]，声明:[模板组件]
})
类模板模块 { }
const mod = this.compiler.compileModuleAndAllComponentsSync(TemplateModule);
常量工厂 = mod.componentFactories.find((comp) =>
comp.componentType === TemplateComponent
);
常量组件 = this.container.createComponent(factory);
Object.assign(component.instance, properties);
}
}

Answer 1

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

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

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