快捷導(dǎo)航

Angularjs全局變量被作用域監(jiān)聽(tīng)的正確姿勢(shì)

更新時(shí)間：2016年02月06日 15:55:42 投稿：mrr

這篇文章主要介紹了Angularjs全局變量被作用域監(jiān)聽(tīng)的正確姿勢(shì)的相關(guān)資料,需要的朋友可以參考下

如果你只想知道結(jié)論：

$scope.$watch($rootScope.xxx,function(newVal,oldVal){
//do something
})

馬上就有人問(wèn)為什么不是:

$rootScope.$watch("xxx",function(newVal,oldVal){
//do something
})

從我最近的一個(gè)bug來(lái)說(shuō)說(shuō)為什么要用第一種方式。

邏輯如圖，一開(kāi)始我使用了 $rootScope.$watch 的寫法。因?yàn)?angularjs 在 $rootScope 上的 watch 一旦注冊(cè)全局有效。而我的這個(gè)全局變量恰好是訂單信息，也就是說(shuō)不同的 controller 對(duì)他都是有改動(dòng)的，每一次改動(dòng)就會(huì)觸發(fā) $rootScope.$watch 進(jìn)入別的 controller?？梢灶惐瓤匆幌?$rootScope 上的 $broadcast 會(huì)全局出發(fā)的。

其實(shí)這并不是唯一的方式，查一下angular 源碼不難找到 watch 方法源碼不分有如下代碼：

return function deregisterWatch() {
if (arrayRemove(array, watcher) >= 0) {
incrementWatchersCount(scope, -1);
}
lastDirtyWatch = null;
};

這段代碼告訴我們，手動(dòng)清理 watch 是可行的。例如：

var watcher = $rootScope.$watch("xxx",function(){});
//手動(dòng)清除 watcher 
watcher();

還是很簡(jiǎn)單對(duì)吧，以上方法同樣可以用于 scope 上的 watch。

研究到這里的時(shí)候，覺(jué)得有點(diǎn)問(wèn)題，那我在 $scope 會(huì)被清理么？于是呼，繼續(xù)翻源碼，我在 $destroy 方法里面找到如下代碼：

// Disable listeners, watchers and apply/digest methods
this.$destroy = this.$digest = this.$apply = this.$evalAsync = this.$applyAsync = noop;
this.$on = this.$watch = this.$watchGroup = function() { 
return noop; 
};
this.$$listeners = {};

以上代碼是本文給大家介紹的Angularjs全局變量被作用域監(jiān)聽(tīng)的正確姿勢(shì)，希望大家有所幫助，本文寫的不好還請(qǐng)各位大俠多多指教。

您可能感興趣的文章: