javascript - 为什么我的 AngularJS $scope.$watch 没有在服务更改时触发？

Question

在我的 Controller 中，我有:var timespanServiceFn;

timespanServiceFn = function() {
  return timespanService.getTimespan();
};

$scope.$watch(timespanServiceFn, $scope.updateVolume());

我的$scope.updateVolume()函数只有一个console.log，这样我就知道我已经到达那里了。

我的timespanService也非常简单:

myApp.service('timespanService', [
  '$http', '$q', function($http, $q) {
    var currentTimespan;
    currentTimespan = '3M';
    this.getTimespan = function() {
      return currentTimespan;
    };
    this.setTimespan = function(timespan) {
      console.log('setting timespan to', timespan);
      return currentTimespan = timespan;
    };
  }
]);

那么为什么当我更改时间跨度时，$watch 没有被触发？

Answer 1

watch 接受两个函数作为参数。您必须将第二个参数作为参数传递，但您只是在那里调用了它:

$scope.$watch(timespanServiceFn, $scope.updateVolume());

因此 $scope.updateVolume() 的 return 语句将被传递给 $watch 函数，而不是函数定义本身。

只需将其更改为:

$scope.$watch(timespanServiceFn, $scope.updateVolume);

<强> See demo