在一页中运行多个 Angular 应用程序

Question

假设页面中已经有一个现有的 angular 正在运行。我想向其中注入/添加一个独立的 angular 应用程序（它与现有的 angular 应用程序独立运行而不受干扰）。

例如，我想 1)<app-root-two></app-root-two>在页面中插入一个自定义元素，然后 2) 初始化/引导该应用程序（反之亦然）。

我将如何实现这一目标？

我知道在 AngularJs 中这是可能的，因为您可以检索 DOM 元素并用于angular.boostrap(<dom-element>)初始化它，但我认为 Angular 没有相同的手动引导模式。它是抽象的，它直接进入 DOM 以查找根元素，通常<app-root>在页面中。

我正在使用的当前 Angular 版本是 5.2 版和 Angular CLI 1.6.6。我已经尝试过.angular-cli.json生成多个应用程序的文件，但是它针对两个单独的“index.html”文件，即一个项目中的两个应用程序，不一定在一个页面中。

Answer 1

查看整体结构指南

您可以简单地加载一个应用程序，但编排（延迟加载）许多不同的模块，这些模块将充当应用程序。每个子主要模块都拥有它需要的所有模块、服务、组件等，并且是隔离的。