AngularJs主窗口和iframe窗口的相同模型

Question

我在点击主窗口上的某个链接时尝试打开一个新的iframe窗口。但是，我想使用相同的模型，即如果主窗口中的数据发生变化，则应该反映在iframe中，反之亦然。主窗口UI将具有几个字段，而iFrame窗口将具有所有字段。

我对angujar世界很新，是否可行？如果有，有什么建议吗？

Answer 1

使用ngInclude指令，angularjs页面上的多个模板的概念是微不足道的。

ngCompile示例显示了一个可拖动的div。

在可拖动元素中放置ng-include应该很容易。 您还可以为整个页面使用相同的控制器，包括ngInclude，从而无需通过service或factory共享数据。

修改

我创建了一个显示单个模板的简单JS Fiddle。 如您所见，输入字段位于主页面中。 然后一个带有ng-include指令的div加载一个内联模板（实际上这些将是完全独立的html页面）。

由于包含的模板没有单独的控制器（可能且常用），因此它位于父控制器的范围内。因此，模板可以访问name.first和name.last变量。

您可以浏览angularjs tutorial

了解有关这些内容的更多信息

Answer 2

不，你不能。新的iFrame在不同的环境中运行。如果来自不同的域，iFrame和父级之间也存在安全限制。

您可以做的是使用html5 postmessage在父级和iframe之间实现消息传递系统。您可以在主窗口中查看范围的更改，通知孩子更改并更新孩子的范围。