javascript - angularjs指令不响应链接函数中的事件绑定(bind)

Question

This plunk指的是。

我有两个简单的元素 (restrict: "E") 指令，incButtonOne 和 incButtonTwo，用于跟踪和显示次数它已被点击。它们都实现本地 Controller 并具有隔离范围。这两个指令完成相同的事情，但实现略有不同:

• incButtonOne 的模板在标记中包含一个 ng-click 指令，以便通过调用指令 Controller 中的函数来促进点击计数
• incButtonTwo 实现一个 link 函数来注册一个点击事件处理程序，该处理程序调用指令 Controller 中的递增函数

它们都有效。有点儿。问题是 incButtonTwo 的显示值仅在单击 incButtonOne 后更新，即该值实际上已更新(这可以通过取消注释 alert 来确认 第 45 行的语句)，但直到执行其他操作后才会显示。

我只是想了解为什么会发生这种情况以及如何解决它。谢谢!

Answer 1

正如 Stanislav Demydiuk 所说，您必须使用 $apply() 来更新您的绑定(bind)。使用你的函数“increment”，你会得到以下结果:

element.on("click", function() {
     scope.$apply(increment);
});

注意:在您的示例中，如果单击第一个按钮使第二个按钮更新，这是因为 ng-click 事件，该事件包含在 $scope.$apply() 中(参见this article)。