Angular JS - 范围观察不更新

Question

我可能正在使用这个错误，但是我有一个监视变量的函数，当从视图中更改该变量时，函数会运行..但是当兄弟函数更改该变量时，监视器不会运行。 我编码错了吗？

scope.$watch (settings.number, function(val){
    alert('test');
})
scope.exampleObj = {
    exampleFunc : function(){
        settings.number += 5;
    }
};

所以当我调用scope.exampleObj.exampleFunc（）; 不应该调查范围吗？

Answer 1

将字符串替换为函数或使用$ watchCollection，如下所示：

使用var：

angular.module('TestApp', [])
    .controller('MainCtrl', function($scope){
        // Object
        var settings = {
            number: 1,
            foobar: 'Hello World'
        };

        $scope.$watch(function(){ return settings.number; }, function(newValue, oldValue){
            console.log('New value detected in settins.number');
        });

        $scope.$watchCollection(function(){ return settings; }, function(newValue, oldValue){
            console.log('New value detected in settings');
        });
    });

使用$ scope：

angular.module('TestApp', [])
    .controller('MainCtrl', function($scope){
        // Object
        $scope.settings = {
            number: 1,
            foobar: 'Hello World'
        };

        $scope.$watch('settings.number', function(newValue, oldValue){
            console.log('New value detected in $scope.settings.number');
        });
    });

示例： http ： //jsfiddle.net/Chofoteddy/2SNFG/

*注意 ：AngularJS 1.1.x及更高版本中提供的$ watchCollection。 如果您需要在数组中观察多个值或在对象中观察多个属性，那么它非常有用。

Answer 2

观察者期望范围内的属性的名称（即字符串），而不是对象本身。

scope.$watch ('settings.number', function(newval,oldval){
   alert('test');
});
  scope.exampleObj = {
  exampleFunc : function(){
      scope.settings.number += 5;
  }
};

我假设您首先声明scope.settings.number ，并且您打算将scope.settings.number settings.number为settings.number因为您只能查看作为角度scope属性的变量。

虽然你可能只用settings.number += 5;做正确的事情settings.number += 5; ，我可能只是累了。

Answer 3

您需要将objectEquality设置为true。 因此，您可以使用angular.equals比较对象的相等性，而不是比较引用相等性。

有关更多信息，请访问文档

scope.$watch (settings.number, function(val){
    alert('test');
},true)
scope.exampleObj = {
    exampleFunc : function(){
        settings.number += 5;
    }
};