我正在尝试动态导入模块中的组件,而不显式导入所有组件。 该模块由两个子模块组成,每个子模块内部都有一个组件。
我不清楚如何从compileModuleAndAllComponentsSync(ExampleModule)
获得的工厂列表中创建组件
这是我的代码:
app.component.html
<ng-container *ngComponentOutlet="myComponent;
ngModuleFactory: myModule;">
</ng-container>
app.component.ts
import { Component, Compiler } from '@angular/core';
import { ExampleModule } from '@example/example.module';
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.css']
})
export class AppComponent {
private myModule: any;
private myComponent: any;
constructor(private compiler: Compiler) {
const componentList = this.compiler.compileModuleAndAllComponentsSync(ExampleModule);
// const componentList = this.compiler.compileModuleSync(ExampleModule);
console.log(componentList);
this.myModule = null; //<-- What goes here...
this.myComponent = null; //<--...and here?
}
}
app.module.ts
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { AppComponent } from './app.component';
import { ExampleModule } from '@example/example.module';
@NgModule({
declarations: [
AppComponent
],
imports: [
BrowserModule,
ExampleModule
],
providers: [],
bootstrap: [AppComponent]
})
export class AppModule { }
如何从我的模块动态创建组件?