Question

这是我正在努力实现的目标：我想使用“插件”创建一个应用程序，我的意思是插件：

另一个角度组件/模块，可以部署在远程主机上并显示在我的应用程序中。

看起来我不能直接用webpack做这样的事情，我应该使用SystemJs动态加载模块。

欢迎任何建议使用SystemJs和Webpack（ng cli），如何调用远程模块并加载它们的示例。

Answer 1

是的，您需要将systemjs添加到angular-cli并使用它来加载模块。然后，您可以使用componentFactoryResolver来解析模块中所需的组件。要将systemjs添加到项目中，请安装它：

npm i systemjs

以及以下angular-cli.json：

"scripts": [
    "../node_modules/systemjs/dist/system.src.js"
],

还要在页面中添加指向scripts.js的链接：

这将加载systemjs，它将作为全局对象使用。然后你可以像这样使用它：

declare var SystemJS;

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {
  constructor() {
    SystemJS.load(...);
  }

有关如何使用SystemJS加载模块的详细信息，请参阅How to load dynamic external components into Angular application answer

Answer 2

我已经意识到基于Angular 4获取和加载远程组件。随意检查我的github项目：https://github.com/dianadujing/dynamic-remote-component-loader

在角度4.4应用程序中获取并加载远程组件/模块

2 个答案: