欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

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

 更新時間:2016年02月06日 15:55:42   投稿:mrr  
這篇文章主要介紹了Angularjs全局變量被作用域監(jiān)聽的正確姿勢的相關(guān)資料,需要的朋友可以參考下

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

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

馬上就有人問為什么不是:

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

從我最近的一個bug來說說為什么要用第一種方式。

邏輯如圖,一開始我使用了 $rootScope.$watch 的寫法。因為 angularjs 在 $rootScope 上的 watch 一旦注冊全局有效。而我的這個全局變量恰好是訂單信息,也就是說不同的 controller 對他都是有改動的,每一次改動就會觸發(fā) $rootScope.$watch 進入別的 controller。可以類比看一下 $rootScope 上的 $broadcast 會全局出發(fā)的。

其實這并不是唯一的方式,查一下angular 源碼不難找到 watch 方法源碼不分有如下代碼:

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

這段代碼告訴我們,手動清理 watch 是可行的。例如:

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

還是很簡單對吧,以上方法同樣可以用于 scope 上的 watch。

研究到這里的時候,覺得有點問題,那我在 $scope 會被清理么?于是呼,繼續(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)聽的正確姿勢,希望大家有所幫助,本文寫的不好還請各位大俠多多指教。

相關(guān)文章

  • angularjs 表單密碼驗證自定義指令實現(xiàn)代碼

    angularjs 表單密碼驗證自定義指令實現(xiàn)代碼

    這篇文章主要介紹了angularjs 表單密碼驗證自定義指令實現(xiàn)代碼,需要的朋友可以參考下
    2016-10-10
  • 解決ionic和angular上拉加載的問題

    解決ionic和angular上拉加載的問題

    這篇文章主要介紹了解決ionic和angular上拉加載的問題,需要的朋友可以參考下
    2017-08-08
  • 詳解Angular中延遲加載的原理與使用

    詳解Angular中延遲加載的原理與使用

    Angular 是一個流行的框架,用于構(gòu)建動態(tài)和響應(yīng)式 Web 應(yīng)用程序,在本文中,我們將討論延遲加載以及它如何與 Angular 中的路由一起工作,感興趣的可以跟隨小編一起學(xué)習(xí)一下
    2023-06-06
  • angularjs實現(xiàn)天氣預(yù)報功能

    angularjs實現(xiàn)天氣預(yù)報功能

    這篇文章主要為大家詳細介紹了angularjs實現(xiàn)天氣預(yù)報功能,文中示例代碼介紹的非常詳細,具有一定的參考價值,感興趣的小伙伴們可以參考一下
    2017-10-10
  • 走進AngularJs之過濾器(filter)詳解

    走進AngularJs之過濾器(filter)詳解

    本篇文章主要介紹了AngularJs之過濾器(filter)詳解,小編覺得挺不錯的,現(xiàn)在分享給大家,也給大家做個參考。一起跟隨小編過來看看吧
    2017-02-02
  • AngularJS 服務(wù)詳細講解及示例代碼

    AngularJS 服務(wù)詳細講解及示例代碼

    本文主要介紹AngularJS 服務(wù),這里整理了AngularJS 服務(wù)的基本知識資料,并附示例代碼和實現(xiàn)效果圖,有興趣的小伙伴可以參考下
    2016-08-08
  • AngularJS基礎(chǔ) ng-include 指令示例講解

    AngularJS基礎(chǔ) ng-include 指令示例講解

    本文主要介紹AngularJS ng-include 指令,這里對ng-include 指令的知識做了詳細整理介紹,有需要的朋友可以參考下
    2016-08-08
  • Angularjs之filter過濾器(推薦)

    Angularjs之filter過濾器(推薦)

    這篇文章主要介紹了Angularjs之filter過濾器的相關(guān)資料,非常不錯,具有一定的參考借鑒價值,需要的朋友可以參考下
    2016-11-11
  • Angular如何由模板生成DOM樹的方法

    Angular如何由模板生成DOM樹的方法

    這篇文章主要介紹了Angular如何由模板生成DOM樹的方法,文中通過示例代碼介紹的非常詳細,對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧
    2019-12-12
  • Angularjs過濾器使用詳解

    Angularjs過濾器使用詳解

    AngularJS提供了過濾器來對輸入輸出數(shù)據(jù)格式化。這篇文章主要介紹了Angularjs過濾器使用的相關(guān)資料,需要的朋友可以參考下
    2016-05-05

最新評論