angularjs指令不响应链接函数中的事件绑定

Question

This plunk指的是。

我有两个简单的元素（restrict: "E"）指令incButtonOne和incButtonTwo，用于跟踪和显示点击的次数。它们都实现了本地控制器并具有隔离范围。这两个指令完成了同样的事情，但实现略有不同：

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

他们都工作。的种类。问题是incButtonTwo的显示值仅在点击incButtonOne后更新，即该值实际上已更新（这可以通过取消注释alert语句来确认第45行）但在执行其他某些操作之前不会显示。

我想了解为什么会发生这种情况以及如何解决这个问题。谢谢！

Answer 1

正如Stanislav Demydiuk所说，你必须使用$apply()让绑定更新。并使用您的函数＆＃34;递增＆＃34;，这是您得到的：

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

注意： 在您的示例中，如果点击第一个按钮会使您的第二个按钮更新，那是因为 ng-click 事件，它包含在$scope.$apply()中（请参阅{{3 }}）。

Answer 2

当您手动注册事件处理程序时，您必须手动调用范围。$ apply（）这样的函数

link: function(scope, element) {
  element.on('click', function() {
     scope.$apply(function() {
        scope.count++;
     });
  });
}