AngularJS 學習筆記——$watch

$watch簡單使用

$watch是一個scope函數，用於監聽模型變化，當你的模型部分發生變化時它會通知你。

 

$watch(watchExpression, listener, objectEquality);

每一個參數的說明以下：

1. watchExpression：監聽的對象，它能夠是一個angular表達式如'name',或函數如function(){return $scope.name}。

2. listener:當watchExpression變化時會被調用的函數或者表達式,它接收3個參數：newValue(新值), oldValue(舊值), scope(做用域的引用)

3. objectEquality：是否深度監聽，若是設置爲true,它告訴Angular檢查所監控的對象中每個屬性的變化. 若是你但願監控數組的個別元素或者對象的屬性而不是一個普通的值, 那麼你應該使用它

 

舉個栗子：

$scope.name = 'hello';

var watch = $scope.$watch('name',function(newValue,oldValue, scope){

        console.log(newValue);

        console.log(oldValue);

});

$timeout(function(){

        $scope.name = "world";

},1000);

$watch性能問題

太多的$watch將會致使性能問題，$watch若是再也不使用，咱們最好將其釋放掉。

$watch函數返回一個註銷監聽的函數，若是咱們想監控一個屬性，而後在稍後註銷它，能夠使用下面的方式：

var watch = $scope.$watch('someModel.someProperty', callback);

//...

watch();

 

還有2個和$watch相關的函數：

$watchGroup(watchExpressions, listener);

$watchCollection(obj, listener);