AngularJSのバインディングとダイジェストはどのように機能するのですか?
2023-10-06 12:47:07
質問
AngularJSが他のJavaScript-MVCフレームワークと異なる点は、バインディングを使用してJavaScriptからHTMLにバインドされた値をエコーすることができる点です。Angularは、$scope変数に何らかの値を代入すると、これを自動的に行います。
しかし、これはどの程度自動なのでしょうか?時には、Angularがその変更を拾ってくれないことがあります。そのため、$scope.$apply() や $scope.$digest() を呼んで、Angularに変更を拾うように通知する必要があります。時々、これらのメソッドのいずれかを実行すると、エラーがスローされ、ダイジェストがすでに進行中であると表示されます。
バインディング({{ }}中括弧やng-attributesの中にあるもの)はevalでエコーされるので、これはAngularが常に$scopeオブジェクトをポーリングして変更を探し、そしてそれらの変更をDOM/HTMLに反映するためにevalを実行しているということでしょうか?それとも、AngularJSは変数の値が変更されたり、割り当てられたりしたときにトリガーされるイベントを発生させる魔法の変数を使うことを理解したのでしょうか?私はそれがすべてのブラウザで完全にサポートされているという話を聞いたことがないので、私はそれを疑う。
AngularJSはどのようにバインディングとスコープ変数を追跡しているのでしょうか?
どのように解決するのですか?
に加えて ドキュメントセクション に加えて、私たちは変更の可能性のあるすべてのソースを列挙することができると思います。
- HTML 入力によるユーザーとの対話 ( 'テキスト' , '数値' , 'url' , 'メール' , 'ラジオ' , 'チェックボックス' ). AngularJSでは inputDirective . text', 'number', 'url', 'email' 入力がバインドされます。 リスナーハンドラ を 'input' や 'keydown' イベントに割り当てることができます。リスナーハンドラ はスコープ.$applyを呼び出します。 . radio'と'checkbox'はクリックイベントのために同様のハンドラをバインドします。
- select要素によるユーザインタラクション。AngularJSでは selectDirective があり、'change' イベントで同様の動作をします。
- 定期的な変更には タイムアウトサービス も行う $rootScope.$apply() .
- イベントディレクティブ (ngClick など) でも スコープ.$apply .
- また、$httpは $rootScope.$apply() .
- AngularJSの世界以外での変更は、ご存知の通りscope.$applyを使用する必要があります。
関連
-
[解決済み] AngularJSのグローバル変数
-
[解決済み] AngularJSでデータバインディングはどのように機能するのですか?
-
[解決済み] AngularJSを使用して、ブラウザのコンソールで$scope変数にアクセスするにはどうすればよいですか?
-
[解決済み] AngularJSで$scope.$watchと$scope.$applyを使用するにはどうすればよいですか?
-
[解決済み] AngularJSのng-repeatでキーと値を反復処理する方法は?
-
[解決済み] AngularJSでEnterキーを押したときにフォームを送信する
-
[解決済み】AngularJSのディレクティブスコープにおける「@」と「=」の違いは何ですか?
-
[解決済み】AngularJSのスコーププロトタイピング/プロトタイピング継承のニュアンスとは?
-
[解決済み】AngularJSの$watchに相当するAngularは何ですか?
-
[解決済み] devDependencies」だけをnpmでインストールする方法
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
[解決済み] ng-repeat内で$indexを使用して、クラスを有効にしてDIVを表示するにはどうすればよいですか?
-
[解決済み] AngularJSの「href」と「ng-href」の違いについて
-
[解決済み] Apigee API へのリクエストで 401 レスポンスエラーが発生する
-
[解決済み] Angularのui-routerでデフォルトの状態を設定する方法
-
[解決済み] 誰かangularjsの$qサービスの使用について説明してください。[重複しています]。
-
処理されない例外が発生しました。Angular 実行中のプロジェクトで NGCC に失敗しました。
-
angularjs が src で指定されたコンテンツを iframe 内で正しく表示しない
-
[解決済み] AngularJSでデータバインディングはどのように機能するのですか?
-
[解決済み] なぜAngularJSはselectに空のオプションを含めるのですか?
-
[解決済み] ng-classを使った複数クラスの追加