Angular＆＃x27; s $ apply（）および$ digest（）を理解する

一流のオンラインAngularJSトレーニングをお探しですか？ Todd MottoのAltimate Angularをご覧ください。 25％の割引とサポートのSitePointにコードSitePointを使用してください！

angularjsの$apply()および$digest()関数は、基本的ですが、時には混乱する要素です。 それらをマスターすることは、Angularjsの内側の動作を理解するための鍵です。この記事では、日常のAngularjs開発における役割と実用的なアプリケーションを明確にしています。

キーテイクアウト：

AngularJSの双方向データバインディングにとって

• および$apply()は重要であり、ビューとスコープモデルの間のシームレスな更新を保証します。 $digest()
レベルで
• >サイクルを開始し、すべての子供のスコープを横断し、ウォッチャーを実行します。 AngularJは、モデルの変更がコンテキスト内で発生したときに自動的に呼び出します。 モデルの変更がAngularJSのコンテキスト（例えば、$apply()またはDOMイベントリスナーを使用する）の外側で行われる場合、$digest$rootScopeの手動呼び出しが必要です。これにより、Angularjsがウォッチャーを更新し、変更を正しく伝播することを示しています。
• ループは複数回反復し、スコープモデルの変更が検証されます。 それ以上の変更が検出されないか、最大反復制限（10）に達するまで続きます。 $apply() setTimeout()
• と$digest：

に深く潜ります

AngularJSの双方向データバインディングは強力な機能です。 ビューの変更は、スコープモデルを自動的に更新し、その逆も同様です。 この魔法は、Angularjsがスコープモデルでウォッチャーを確立するために起こります。 これらのウォッチャーは、カスタムウォッチャーに似ています： $apply() $digest()変更がいつでもリスナー関数を実行します。 重要な質問は、次のことです：Angularjsは、これらのリスナー機能をいつ呼び出すかを知っていますか？

答えは

サイクルです。 このサイクルはウォッチャーを引き起こします。 ウォッチャーが発射すると、AngularJSがスコープモデルを評価します。変更が検出された場合、対応するリスナー関数が実行されます。

$scope.$watch('aModel', function(newValue, oldValue) {
  // Update the DOM with newValue
});

サイクルは

によって開始されます。たとえば、ANaModelハンドラー内のスコープモデルを変更すると、AngularJSは自動的に呼び出します。 これにより、サイクルが開始され、すべてのウォッチャーを発射し、それに応じてビューを更新します。 その他のディレクティブ/サービス（例えば、、）もトリガー

サイクルをトリガーしますただし、Angularjsは直接

を呼び出しません。代わりに、$digest()を使用します。これにより、$scope.$apply()サイクルがルートから始まり、子のスコープを介して伝播します。 関数を使用して$rootScope.$digest()を使用する場合、AngularJSは$digest。 ng-click$scope.$apply()には2つの形式があります。1つは引数として関数を受け入れる（優先）と、単純に

サイクルを開始するアーチュメントなしバージョンです。

$apply()マニュアル$digest招待状：

マニュアルはいつ必要ですか？ Angularjsは、そのコンテキスト内で$apply()内で作成されたモデルの変更のみを説明します（つまり、コードをにラップします）。組み込みディレクティブはこれを自動的に処理します。 ただし、AngularJSのコンテキスト以外のモデルを変更する場合は、Angularjsに変更を通知するために手動で

に電話する必要があります。 たとえば、を使用するには、マニュアル$apply()：：が必要です。 $apply() $apply()なしでは、ビューは更新されません。 これは、自動的に

を処理するため、setTimeout()を好みます。 $apply()。

$scope.$watch('aModel', function(newValue, oldValue) {
  // Update the DOM with newValue
});

ループイテレーション：$apply()$timeout $apply()$apply()ループは繰り返し実行され、モデルの変更が確認されます。 リスナー機能がモデルを変更すると、ループが再起動してこれらの変更を説明します。これは、これ以上の変更が見つからないか、最大反復カウント（10）に達するまで続きます。 IDEMPOTENTリスナー機能を目指して、ループ反復を最小限に抑える try...catch$exceptionHandler結論：

に電話することを忘れないでください。 可能な場合は、手動$digest呼び出しを避けるためにを使用します

（FAQSセクションは簡潔に削除されました。提供されたFAQは繰り返しで、書き直されたテキストの本体で大部分がカバーされていました。）

以上がAngular＆＃x27; s $ apply（）および$ digest（）を理解するの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。