在其他域的 div 中包含一个 angular 应用程序,没有 iframe

Include an angular app in a div on an other domain, no iframe

我有一个 angular 应用程序,它具有各种依赖项,例如模块和样式。

另一方面,我有多个网站,我想在其中包含此应用程序及其所有依赖项(就像在 iFrame 中一样)。 我想将该应用程序包含在 div 中(就好像它是一个 iframe),但我必须是一个 div,没有 iFrame,因此其他网站可以为内联应用程序选择自己的样式。

这样,当我将应用程序添加到我的 CORS 时,我可以让每个站点都包含该应用程序。 喜欢:

<div ng-include="app_from_other_domain"></div>

包含所有路由 div。

阅读了很多文档后,我不知道从哪里开始。 如有任何帮助,我们将不胜感激!

为什么不将应用程序包装在自己的模块中并创建一个指令来使用它?然后在您的其他 angular 应用程序中只需要该模块。那不是更干净吗?

这是不可能的,因为当 Angular JS 执行摘要循环时,它是文档范围的,始终假设您的文档中只有一个应用程序。

与 Angular 共享应用程序的方法是将您的应用程序设计得很好,然后您可以从其他 angular 应用程序加载和包含所需的模块。

尝试做以下事情

  • 创建您的应用程序并将其分配给模块,例如angular.module('sub-application').controller().config();
  • 定义你的routes/partials/controllers等等
  • 您只需要访问应用程序的主要模块,以便您可以在其中注入您的模块名称
  • 您想 运行 您的应用程序仅用于潜水,因此将子应用程序控制器分配给该潜水
  • 其他选项不是使用 ngRoute 或 ui-route 状态和部分使用 jquery 隐藏或在多个 views.Other 功能之间切换,您可以使用 angular 控制器