2013-02-02 2 views
6

AngularJSのディレクティブを理解するのは苦労します。 AngularJS自身によって定義は、最高の状態で混乱しています:Angular.JSのディレクティブは何ですか

Directives are a way to teach HTML new tricks. During DOM compilation directives are matched against the HTML and executed. This allows directives to register behavior, or transform the DOM.

誰かが、一般的に教育プログラミングで使用平易な英語でAngularJSでディレクティブを説明してもらえます。次のようなものがあります。directives are funcions/objects that extends ...

+1

の可能重複[angularjsディレクティブは何?](のhttp:/ /stackoverflow.com/questions/13875466/what-is-an-angularjs-directive) –

答えて

9

これは、HTMLを拡張したり、新しい要素を追加したり、既存の要素に新しい属性を追加する方法です。 Angularの開発者ガイドから:

ディレクティブは、カスタム属性、要素名、またはクラス名の存在によってトリガーされるビヘイビアまたはDOM変換です。ディレクティブを使用すると、HTMLボキャブラリを宣言的に拡張できます。あなたは、HTMLに動作を追加スコープとDOM要素に属する変数間の結合双方向を保つリンク関数を定義する、または動的にDOMを操作するため、変更することができますコンパイル機能を定義するためのいずれかにそれらを使用することができます

新しいDOM要素や属性を生成することさえできます。 HTMLを拡張してドメイン固有言語に変換する方法を考えてみましょう。

+0

私はあなたが何を意味するのか見ていますが、HTMLをドメイン固有の言語に仕立て上げる方法を詳しく説明できますか?私はそれがドメインがインターネットだけであると思う。 Angularでは、マークアップ言語とは対照的に、ドメイン固有のPROGRAMMING言語になります。 – user137717

4

ディレクティブは、属性、タグ、またはクラス名にすることもできます。

HTMLマークアップに書き込むと、角度でピックアップされ、定義したとおりに動作します。

それはあなたのような新しいカスタムHTML要素を定義する機能を提供しますか、または新しい動作が

<div angry></div> 

のような属性と、誰かがそれをクリックしますいつでも、彼は「私は怒っているよ」と得ると警告しますDIV 。

基本的には、HTMLを可能な限りリーンで理解しやすいようにするために必要なすべての拡張機能を実行できます。それはすべてあなたがディレクティブを定義する方法に依存します。

+0

_angularインタープリタのようなものはありません。ディレクティブがDOM解析フェーズで解析され、コンパイル関数が実行されてDOMを変換し、リンク関数はスコープに添付され、ブラウザのイベントループのコンテキストで実行されます。 – remigio

+0

Angularのダイジェストサイクルはブラウザのイベントループではなく、単にそれによってトリガされます。しかし、あなたは正しいです、あなたはよりスマートで、よりハンサムです...私は "通訳"という言葉を削除します。 –

+0

私はあなたよりもスマートでもハンサムでもありません。私は、誰もが読むことを混乱させると思っていたので、角度コードは解釈されていないと言いたかっただけです。とにかく私は謝罪する、私はどちらも攻撃的でもあなたの答えを減らしたくない – remigio

0

AngularJSディレクティブは、HTMLテンプレートマークアップ(属性、要素、CSSクラス)とJavaScriptコードの組み合わせです。 angularJs JavaScriptコードは、html要素のhtmlデータと動作を定義します。

AngularJsディレクティブは、HTMLボキャブラリを拡張するために使用されます。つまり、新しい動作でHTMLエレメントをデコレートし、HTMLエレメントの属性を面白い方法で操作するのに役立ちます。

のようなNGアプリ、NG-コントローラ、NG-繰り返し、NG-モデルなどとしてAngularJSが提供するいくつかの組み込みのディレクティブがあります

関連する問題