76

AngularJS が他の JavaScript-MVC フレームワークと異なる点の 1 つは、バインドを使用して、バインドされた値を JavaScript から HTML にエコーできることです。$scope 変数に任意の値を割り当てると、Angular はこれを「自動的に」行います。

しかし、これはどのくらい自動的ですか？Angular が変更を認識しない場合があるため、$scope.$apply() または $scope.$digest() を呼び出して、angular に変更を認識させるよう通知する必要があります。これらのメソッドのいずれかを実行すると、エラーがスローされ、ダイジェストが既に進行中であることが示されることがあります。

バインディング ({{ }} の中括弧または ng 属性内のもの) は eval でエコーされるため、これは、Angular が常に $scope オブジェクトをポーリングして変更を探し、eval を実行してそれらの変更を DOM/ にプッシュすることを意味します。 HTML? または、AngularJS は、変数値が変更または割り当てられたときにトリガーされるイベントを発生させる魔法の変数の使用をどうにかして理解しましたか? すべてのブラウザで完全にサポートされているとは聞いたことがありません。

AngularJS はそのバインディングとスコープ変数をどのように追跡しますか?

4

2 に答える 2

64

Mark が見つけたドキュメント セクションに加えて、変更の可能性のあるすべてのソースを列挙しようとすることができると思います。

  1. HTML 入力 ( 'text'、'number'、'url'、'email'、'radio'、'checkbox' ) とのユーザー インタラクション。AngularJS にはinputDirectiveがあります。「text」、「number」、「url」、および「email」の入力は、「input」または「keydown」イベントのリスナー ハンドラーをバインドします。リスナー ハンドラは scope.$apply を呼び出します。'radio' と 'checkbox' は、クリック イベントの同様のハンドラーをバインドします。
  2. select 要素とのユーザー インタラクション。AngularJS には、「変更」イベントで同様の動作をするselectDirectiveがあります。
  3. $rootScope.$apply()も行う$timeout サービスを使用した定期的な変更。
  4. eventDirectives (ngClick など) もscope.$applyを使用します。
  5. $http は$rootScope.$apply()も使用します。
  6. ご存じのとおり、AngularJS の世界外の変更には scope.$apply を使用する必要があります。
于 2012-09-19T08:52:58.257 に答える
5

お気づきのように、これはポーリングではなく、内部実行ループを使用しているため、$apply() または $digest() を使用して動作を開始する必要があります。

Miško の説明は非常に徹底していますが、少し欠けているのは、Angular が独自のコンテキスト内で何かが発生するたびに $scope を明確な内部状態に戻そうとしているだけだということです。これには、モデルの状態間でかなりのバウンスが必要になる可能性があるため、$watch() を 1 回だけ起動することに依存できない理由と、モデル間の関係を手動で設定する際に注意する必要がある理由でもあります。循環リフレッシュ。

于 2012-09-19T00:23:49.000 に答える