1

我有一个使用 Angular 6 框架用 JS 编写的 SPA，我想动态渲染一个位于远程服务器上的 Angular 组件。

我目前正在使用viewContainerRef动态渲染位于我的项目中的组件，但我的想法是提取所有这些组件并将它们放在远程服务器上。

我试过了innerHTML，但这还不够强大。

我相信要走的路是查看通用应用程序，但我不确定。

有任何想法吗？甚至可能吗？

4

1 回答 1

0

对于那些感兴趣的人。

我基本上关注了Manfred Stayer的这篇博客，他解释了如何创建一个可以从 Web 加载的外部 Angular 组件。

只需按照博客中的步骤操作，然后在构建项目后，您将得到一个包含已构建项目的 bundle.js 文件。我决定将此文件放在可以随时检索的公共 S3 存储桶中，如下所示：

加载脚本

load(url, cb): void {
    const script = document.createElement('script');
    script.src = url; // s3 path
    document.body.appendChild(script);
    cb();
  }

创建元素

  // load app from url
  loadAppComponent(url, identifier, data) {
    this.externalService.load(url, () => {
      const component = document.createElement(identifier);
      component.setAttribute('data', JSON.stringify(data));
      const content = document.getElementById('content');
      content.appendChild(component);
    });
  }

有关更多详细信息，请查看Manfred Stayer的博客！

于 2018-10-22T14:48:03.160 回答