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，因为您只能查看属性为scope的变量{ {1}}。

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

Answer 3

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

了解更多信息，请访问the documentation

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

Angular JS - 范围观察不更新

3 个答案: