如何将多个angular2子应用程序动态集成到一个父角度应用程序中

Question

我正在研究一个用例，我需要在主要的父应用程序中放置多个ng2应用程序。我可以使用systemjs bundle配置和＆＃39; loadChildren＆＃39;来管理路由。 angular2 Routes中的属性，但子应用程序可以有单独的路径和单独的systemjs配置。怎么做到这一点？

Answer 1

您可以延迟加载多个@NgModules，其中每个模块都是一个单独的应用程序。

compRef: ComponentRef<any>; 
constructor(private moduleLoader: SystemJsNgModuleLoader) { }

this.moduleLoader.load(`/path/to/my/app`)
  .then((moduleFactory: NgModuleFactory<any>) => {
    const vcRef = this.vcRef;
    const ngModuleRef = moduleFactory.create(vcRef.parentInjector);
    const comp = ngModuleRef.injector.get(LazyLoadConfig).component;
    const compFactory = ngModuleRef.componentFactoryResolver.resolveComponentFactory(comp);
    this.compRef = vcRef.createComponent(compFactory, 0, ngModuleRef.injector);
  });

查看this plunker的工作示例。