ホームページ > ウェブフロントエンド > jsチュートリアル > Angularjs グローバル変数をscope_AngularJS で監視する正しい方法

Angularjs グローバル変数をscope_AngularJS で監視する正しい方法

WBOY
リリース: 2016-05-16 15:16:05
オリジナル
1346 人が閲覧しました

結論だけを知りたい場合:

$scope.$watch($rootScope.xxx,function(newVal,oldVal){
//do something
})
ログイン後にコピー

誰かがすぐに、なぜそうしないのか尋ねました:

$rootScope.$watch("xxx",function(newVal,oldVal){
//do something
})
ログイン後にコピー

私が最近遭遇したバグの最初の方法を使用する必要がある理由を説明しましょう。

ロジックは図の通りです。最初は$rootScope.$watchの記述方法を使用しました。 $rootScope 上の angularjs の監視は、一度登録されるとグローバルに有効になるためです。そして、私のグローバル変数は偶然にも注文情報です。これは、さまざまなコントローラーがその変数に変更を加えていることを意味し、すべての変更が $rootScope.$watch をトリガーして他のコントローラーに入るようにします。同様に、$rootScope 上の $broadcast がグローバルに開始されます。

実際には、これが唯一の方法ではありません。次のコードを含む Angular ソース コードをチェックすることで、watch メソッドのソース コードを見つけることは難しくありません。

return function deregisterWatch() {
if (arrayRemove(array, watcher) >= 0) {
incrementWatchersCount(scope, -1);
}
lastDirtyWatch = null;
};
ログイン後にコピー
このコードは、時計を手動でクリーニングすることが可能であることを示しています。例:

var watcher = $rootScope.$watch("xxx",function(){});
//手动清除 watcher 
watcher();
ログイン後にコピー
それでも非常に簡単ですよね?上記の方法はスコープ上の時計にも使用できます。

これを調査したときに、問題があると感じました。$scope はクリアされますか?そこで、引き続きソース コードを調べていくと、$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 グローバル変数を監視するための正しい姿勢です。この記事がうまく書かれていない場合は、アドバイスをお願いします。

ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート