从另一个 url-angular4 加载动态模块

Question

是否可以引用一个模块（已编译为 umd 或 es 格式）并在已编译的 Angular 应用程序中动态加载它？

1. 主 shell 应用程序托管在：http://plugin_shell.mydomain.com
2. 一个模块（带有一堆组件、服务等）：编译后的代码 托管在另一个 url。让我们说： http://plugins/modules/myfirstplugin.umd.js
3. 外壳加载时。加载所有模块，渲染特定组件，参考 到服务、使用类等。

我尝试使用 SystemJsNgModuleLoader.load 加载模块，但它似乎确实适用于这种用例。

谢谢

编辑：同样的问题（没有答案）：How to dynamically load external angular 2 module (like served from an external module.bundle.js)

Answer 1

你可以这样做：

@Component({
  providers: [
    {
      provide: NgModuleFactoryLoader,
      useClass: SystemJsNgModuleLoader
    }
  ]
})
export class ModuleLoaderComponent {
  constructor(private _injector: Injector,
              private loader: NgModuleFactoryLoader) {
  }

  ngAfterViewInit() {
    this.loader.load('app/t.module#TModule').then((factory) => {
      const module = factory.create(this._injector);
      const r = module.componentFactoryResolver;
      const cmpFactory = r.resolveComponentFactory(AComponent);

      // create a component and attach it to the view
      const componentRef = cmpFactory.create(this._injector);
      this.container.insert(componentRef.hostView);
    })
  }
}

阅读Here is what you need to know about dynamic components in Angular 了解更多详情。特别是Dynamic module loading and compilation 部分。