Q

AngularJSは内部的に 'onclick'、 'onchange'のようなイベントをどのようにキャッチしますか？

angularjs

2013-04-01 6 views 8 likes

8

入力要素に「ng-model」を使用し、その要素をクロム・インスペクタで観察しました。しかし、入力要素のonxxxプロパティ（onchangeを含む）はすべてnullでした。次に、AngularJSはユーザー入力によってトリガされる "onchange"イベントをどのように捕捉できますか？AngularJSは内部的に 'onclick'、 'onchange'のようなイベントをどのようにキャッチしますか？

2013-04-01 firia2000

+0

http://stackoverflow.com/questions/9682092/databinding-in-angularjsをご確認ください。 –

+0

@fastreloadありがとうございました！私はちょうどその記事を読んだが、まだ明らかではない。その記事によると、AngularJSはダーティチェックに$ apply（）と$ digest（）を使用しています。しかし、誰がその機能を呼んでいますか？ 'angular'モジュールは、ポーリングのためにsetInterval（）のようなものを使用しますか？ – firia2000

+0

'digest'フェーズを開始するいくつかのイベントウォッチャーがあります.Stewieの答えにはいくつかの詳細があります。 –

A

答えて

13

は、Chromeのイベントリスナ]タブでは、あなたが標準的なテキスト入力要素（NG-モデルが付属して）を点検し、場合あなたはそれが取り付けられた2人のイベントリスナーを持っていることがわかります。

角度はデフォルトでinputイベントをリッスンし、ブラウザでサポートされていない場合はchangeイベントに戻ります。

イベントはjQliteのバインドメソッドにバインドされます（完全なjQueryも含まれていない場合は、バインドメソッドが継承されます）。

自分で検査できる入力要素の例は、input [email]ディレクティブのドキュメントページにあります。

Exact line in Angular source (v1.2.0rc1)入力イベントの処理を担当します。

2013-04-01 08:44:47 Stewie

+0

今は完全にクリアです。ありがとうございました！ – firia2000

+1

なぜjqueryはval（）で入力イベントを発生させませんか？この変更を正しく伝達するにはどうすればよいでしょうか？ – tommybananas

+0

@ snowman4415このように：http://stackoverflow.com/a/17110709/1095616 – Stewie

-1

あなたが使用して、任意のDOMノードにイベントリスナーを添付することができます。

node.addEventListener（eventNameの、listenerMethod、useCaptureは）

あなたがにaddEventListenerを使用して、node.onchangeする方法前に割り当てられている間、あなたがする必要がありますイベントリスナーをイベント 'change'に追加するか、 'click'をクリックします。

参照：$destroyとinput：https://developer.mozilla.org/en-US/docs/DOM/EventTarget.addEventListener

2013-04-01 08:19:17 KKetch

+1

質問は特にanglejsについてですが、domイベントハンドラではありません –

+0

まあ、AngularJSはまだDOMを使ったjavascriptですか？ DOMを使っていくつかのイベントリスナをアタッチすると、角度が分かりませんが、ドキュメント要素にイベントが添付されていて、イベントバブリングを使用してDOMイベントを受け取るターゲットをフィルタリングしているとします。 – KKetch

+0

ベースでは、そうする必要があります。しかし、実際には、あなたが「想定している」ようには機能しません。それは何が変わったのかを見つけるために汚れたチェックモデルを使います。あなたはそれについてもっと読むことができます：//stackoverflow.com/questions/9682092/databinding-in-angularjs –

関連する問題