Question

我是AngularJs的新手，我使用的是角1.4。问题是：我正在使用这样定义的简单计数器对象：

var myCounter = (function(){
                    var count =0;
                    return {
                        "inc": function(){
                            count++;
                        },
                        "dec": function(){
                            if(count>0){
                                count--;
                            }
                        },
                        "getCount": function(){
                            return count;
                        }
                    };
                })();

我想将count变量保密，只能通过＆＃39; getCount＆＃39;来读取值。功能

每当计数增加/减少时，我必须根据更新的＆＃39; count＆＃39;来执行一组操作。为此，我想使用＆＃39; $ watch＆＃39;观察变化。但我只能通过调用函数＆＃39; getCount（）＆＃39;来获取值。

请建议我如何写一个＆＃39; $ watch＆＃39;在这种情况下。如果这不是一个正确的方法，请建议一个更好的方法。

提前致谢！

Answer 1

$watch的格式为$watch(watchExpression, listenerFunction)。在这种情况下，watchExpression可以是要评估的函数。因此，您可以将getCount函数（不是函数的结果）传递给$watch。

所以，

$scope.$watch(myCounter.getCount, function() {})

将起作用，假设Controller可以访问myCounter，$watch已定义。

Answer 2

$scope.$watch(myCounter.getCount, function(){
    //Do stuff
})

Answer 3

每当callback增加/减少时，您需要执行count。您可以将callback传递给构造函数，如下所示：

var myCounter = (function(callback){
                    var count =0;
                    return {
                        "inc": function(){
                            callback(++count);
                        },
                        "dec": function(){
                            if(count>0){
                                count--;
                            }
                            callback(count);
                        },
                        "getCount": function(){
                            return count;
                        }
                    };
                })();

或者您可以通过callback或inc事件传递dec：

var myCounter = (function(){
                    var count =0;
                    return {
                        "inc": function(callback){
                            callback(++count);
                        },
                        "dec": function(){
                            if(count>0){
                                count--;
                            }
                            callback(count);
                        },
                        "getCount": function(){
                            return count;
                        }
                    };
                })();

两种方法的区别在于，在第一种方法中，您将在任何增加/减少事件中执行相同操作，而在第二种方法中，您可以在发生此类事件时定义callback行为。

Answer 4

好看article $ watch等等！我希望这会引导你正确的方式。在您的情况下，您应该在范围内声明对象，因为angular仅监视$ scope变量，因此您的代码将如下所示。

$scope.myCounter = (function(){
                var count =0;
                return {
                    "inc": function(){
                        count++;
                    },
                    "dec": function(){
                        if(count>0){
                            count--;
                        }
                    },
                    "getCount": function(){
                        return count;
                    }
                };
            })();

$scope.$watch('myCounter.getCount', function(newValue, oldValue) {
     if(newValue != oldValue && newValue !=null){
         //call your function..
       }
})

$观察函数的返回值

4 个答案: