如何将 Angular 应用程序嵌入到另一个 Angular 应用程序中

【问题标题】：How to embed Angular app inside another Angular app如何将 Angular 应用程序嵌入到另一个 Angular 应用程序中
【发布时间】：2017-09-28 14:06:41
【问题描述】：

我有两个 Angular 项目。一个叫App1，另一个叫Angular Form Editor。我想将 Form Editor 嵌入到 App1 （项目）中。我该怎么做？

【问题讨论】：

在 Angular 2 中你应该使用 Angular 2 模块。如果您想将 Angular 2 应用程序构建到另一个 Angular 2 应用程序中，您可以将第一个 Angular 2 应用程序用作 Angular 2 模块，然后将其导入第二个 Angular 2 应用程序
所以我需要首先在我的 App1 项目中将 FormEditor App 创建为 angular2 模块？任何示例请提及链接。
他们应该如何相互交流？
现在我只想将表单编辑器的界面嵌入到App1中。之后我将为其设置后端。所以它会相互通信。我的要求是使用表单- App1 的编辑器界面。

标签： angular

【解决方案1】：

使用 App2 构建模块。

这可能是一项复杂的任务，但有很多模板可供您使用。我创建了这个最小的模块模板 - 随意使用它：https://github.com/angular-patterns/ng-module-template

然后用 App1 创建一个应用并导入 App2 模块。确保从 App2 模块声明组件。

import 'App2Module' from 'App2Module';

@NgModule({
    imports: [App2Module],
    declarations: [App2Component]
})

如果您还需要应用模板，这里有一个：

它使用 @ngtools/webpack 作为 AoT buld。

【讨论】：