我有以下代码可以动态加载模块:
export class DynamicQuestionComponent {
constructor(
private componentFactoryResolver: ComponentFactoryResolver,
private viewContainerRef: ViewContainerRef
) {}
@Input() form: FormBase;
@Input() formgroup: FormGroup;
@ViewChild('content', { read: ViewContainerRef, static: true }) content: ViewContainerRef;
@Input() set question(qvalue){
if (qvalue){
this.content.clear();
var compath = `./${qvalue.qType}-question.component`;
var testpath = './proto-question.component';
import('./proto-question.component').then( dyncomp => {
const component = this.viewContainerRef.createComponent(this.componentFactoryResolver.resolveComponentFactory(dyncomp.ProtoQuestionComponent));
(<any>component).instance.form = this.form;
(<any>component).instance.question = qvalue;
(<any>component).instance.formgroup = this.formgroup;
this.content.insert(component.hostView);
component.injector.get(ChangeDetectorRef).markForCheck();
})
}
}
}
当前,如果我在import函数中对组件路径进行硬编码,则这是唯一的方法。我希望能够将一个变量传递给导入函数,但是每次我切换到该变量时,都会得到可怕的找不到模块错误:
ERROR Error: Uncaught (in promise): Error: Cannot find module './proto-question.component'
如您所见,我什至测试了一个与硬编码版本完全相同的变量,并且该变量也失败了。
我觉得必须进行一些设置才能使其正常工作。
我正在使用:
角9.1.9
Angular CLI 9.1.4
假设我可以解决动态变量问题,那么我需要弄清楚如何将动态组件传递到resolveComponentFactory调用中。
不幸的是,无法通过变量加载动态模块。我有类似的问题,我找不到解决方案。通过动态路由动态导入模块
本文收集自互联网,转载请注明来源。
如有侵权,请联系 [email protected] 删除。
我来说两句