Angular 从外部内容动态加载组件

我正在研究的系统由许多分布式微服务组成，每个组件可能有多个版本同时处于活动状态

我尝试构建的Angular2应用程序应能够通过WebSocket与这些组件中的每一个进行交互。因为似乎不可能为每个组件的所有未来版本和功能、各自的协议实现甚至新组件准备此应用程序，所以我希望将此责任推给组件本身

每个组件都能够通过通过相同的websocket连接发送的包来通信其功能（以NG2组件的形式）以及协议实现和必要的GUI元素（HTML/CSS）

---

是否有一种模式可以在ng2中实现这种组件及其模板的“按需加载”？

看起来您可以尝试使用路由器延迟加载，并提供可通过websocket加载组件的

NgModuleFactoryLoader

的自定义实现

我不太确定我是否完全理解你的问题

是否有一种模式可以实现ng2中组件及其模板的这种“按需加载”

还有按需加载模块，使用延迟加载模块，请参见： 我强烈推荐阅读这本指南，它真的很有帮助

但他们应该能够共享服务和图书馆

Angulars指南建议使用共享模块和核心模块。事实上，我认为这是最好的方法。只需向下滚动上面的链接

每个组件都能够通过通过相同的websocket连接发送的包来通信其功能（以NG2组件的形式）以及协议实现和必要的GUI元素（HTML/CSS）

这是我不确定的部分，就像我不知道我是否正确理解你的意思。您不想通过websocket连接加载组件，对吗？如果是，为什么？

---

如果您的意思是使用相同的websocket只为每个组件进行通信：我建议使用一个这样做的服务，它将是核心模块的一部分，因此是一个单例。然后，组件可以访问此服务，因此它们始终连接到同一websocket。

下面是可以实现的步骤

• 使用systemjs loader在路由器中加载组件``
• 在systemjs配置文件中，提供组件的路径

---

这些解释更为详细。

每个组件是否可以独立存在于页面（正文）的顶层，每个组件作为一个独立的角度应用程序并排存在，只是相互通信，或者它们是否需要像实际组件一样嵌套。无需嵌套组件或相互交互，但他们应该能够共享服务和图书馆。我想这样的事情会奏效的。我不知道如何处理在不同时间加载的应用程序。例如，当名称被损坏时，如何使一个应用程序在缩小后找到另一个应用程序的类。这看起来很有希望，谢谢，我将尝试复制它。你能详细说明一下吗？延迟加载功能模块是路由器的内置功能，可以通过提供

NgModuleFactoryLoader

的实现来定制加载。因此，如果要使用web套接字加载模块，则必须提供自定义加载程序。NgModuleFactoryLoader需要实现加载（路径：string）方法。您是否建议：通过websocket接收已编译功能的字符串_module.js，将其保存到临时文件中，将临时文件路径馈送到自定义NgModuleFactoryLoader实现中？路径用于为模块加载器（systemjs、webpack等）创建参数，模块加载器将自动加载预编译的功能模块。检查systemjs Implementation谢谢您的回答。我已经根据bergben和kemsky的答案实现了一个原型。不幸的是，我无法在两个岗位上平均分配奖金。掷硬币决定把赏金给伯格本。