捕鼠器键绑定正在更新$ scope，但未被$ watch检测到。

Question

基本上我创建了一个函数来更新作用域变量

// controller.js

$scope.variable = 0;
$scope.$watch('variable', function(){
  console.log("change from watch");
});

$scope.increment = function(){
  $scope.variable++;
  console.log($scope.variable)
}

当我将键绑定到此功能时，

Mousetrap.bind('j', $scope.increment)

浏览器中的console.log显示，当按下键（在本例中为“ j”）时，变量增加了，但是从未调用上面的$ scope。$ watch函数，并且console.log消息“从watch更改了” “不会被解雇。

但是，当我在HTML文件上附加点击处理程序时，

// index.html
<a ng-click="increment()">{{ variable }}</a>

变量增加，console.log显示$scope.variable增加，并且$ watch函数也被触发。

除了此问题之外， {{ variable }}在使用键绑定时不会更改，但是在单击时会更改。

我的猜测是，捕鼠器中缺少某些东西会导致函数触发，但不会与AngularJS $ scope同步？

Answer 1

确保您已阅读有关AngularJS中的数据绑定的信息 。 基本上，为了使AngularJS对更改做出反应，需要触发$ digest 。 内置的ngClick指令在ngClick执行此操作。

当使用非AngularJS API（例如Mousetrap ）时，您需要将回调手动包装在$ apply中 ，例如：

Mousetrap.bind('j', () => $scope.$apply($scope.increment));