Question

我的代码方案： 我有Angular 2应用程序，它在多个字段中有一个输入字段（用于查找），它在弹出窗口（使用window）中打开一个十年前的URL来获取一些查找数据。它从父页面的index.html对象回调函数。

该功能在Angular 2应用程序的<script> function handler(res) { var value = res; } </script>页面中定义，如下所示：

value

需要： 变量inputModel现在必须绑定/绑定到名为<script>的输入模型。有没有办法实现这一目标？

请注意：我知道这不是一个使用{{1}}标签的好习惯，一切都必须基于组件。但它是我收到任务的方式:-P

谢谢！

Answer 1

您可以将值存储在窗口对象上，如下所示：window['value'] = res;

现在，您可以访问角度组件中的res值，例如window['value']

但是，现在的问题是，只有在角度组件从handler对象中读取value时已经调用了window，这才会起作用。对于更新value对象中window属性的任何后续处理程序调用，不会通知您的角度组件。

因此，您需要一个机制，以便全局处理程序函数通知您的角度组件，您的窗口对象上的value属性已更新。

这是从角度外部与角度分量进行通信的一种方法：

在角度组件的模板中，创建隐藏的input
将(click)处理程序附加到此。
在全局handler功能中，使用document.getElementById('hidden input's id').click()模拟点击。
现在，您在步骤2中创建的(click)处理程序将被调用。
现在，每次调用全局handler函数时，都会调用angular的上下文中的(click)处理程序，实质上是告诉angular从window对象获取更新的值。 / LI>
这是working Plunker

在这个plunker中，我将全局处理函数附加到html的{{1}}处理程序，该处理程序位于angular的上下文之外，以模拟您的需求。这个点击事件将使用我上面提到的方法传达给角度组件。