AngularJS指令
AngularJSは、ディレクティブと呼ばれる新しいプロパティでHTMLを拡張します。
AngularJSは、組み込みの命令を介してアプリケーションに機能を追加します。
AngularJSを使用すると、ディレクティブをカスタマイズできます。
AngularJS指令
AngularJSディレクティブは、プレフィックスng-を備えた拡張HTML属性です。
NG-APPディレクティブは、AngularJSアプリケーションを初期化します。
NG-Initディレクティブはアプリケーションデータを初期化します。
NG-Modelディレクティブは、アプリケーションに要素値（入力フィールドの値など）をアプリケーションにバインドします。
完全な手順については、AngularJSリファレンスマニュアルを参照してください。
AngularJSインスタンス
<！Doctype html> <HTML> <head> <meta charset = "utf-8"> <script src = "http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"> </scrip> </head> <body> <div ng-app = "" " ng-init = "firstName = 'john'"> <p>入力ボックスに入力してみてください：</p> <p> name：<入力タイプ= "text" ng-model = "firstname"> </p> <p> {{firstName}} </p> </div> </html> </html> </html>実行結果：
入力ボックスに入力してみてください：
名前：
あなたがタイプしたのはジョンです
NG-APP指令は、AngularJSに<div>要素がAngularJSアプリケーションの「所有者」であることを伝えます。
注：Webページには、異なる要素で実行されている複数のAngularJSアプリケーションを含めることができます。
データバインディング
上記の例の{{firstName}}式は、AngularJSデータ結合式です。
AngularJSのデータ結合、AngularJS式とAngularJSデータの同期。
{{firstName}}は、ng-model = "firstName"によって同期されます。
次の例では、2つのテキストフィールドは、2つのNGモデルディレクティブによって同期されています。
AngularJSインスタンス
<！doctype html> <html> <head> <meta charset = "utf-8"> <script src = "http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"> </scrip> </head>計算数量：<入力タイプ= "番号" ng-model = "数量">価格：<inputタイプ= "ng-model =" price "> <p> <b>合計価格：</b> {{数量 *価格}} </p> </div> </body> </html>実行結果：
価格計算機
量：価格：
合計価格：5
注：ng-initの使用はあまり一般的ではありません。コントローラーの章でデータを初期化するより良い方法を学びます。
HTML要素を繰り返します
NG-Reepeatディレクティブは、HTML要素を繰り返します。
AngularJSインスタンス
<！doctype html> <html> <head> <meta charset = "utf-8"> <script src = "http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"> </scrip> </head> data-ng-init = "names = ['jani'、 'hege'、 'kai']"> <p> ng-repeatを使用してアレイをループに使用します</p> <ul> <li data-ng-repeat = "x in names"> {{x}} </li> </ul> </div> </body> </html> </html>ng-リピートを使用して配列をループします
NG-Reepeatディレクティブは、オブジェクトの配列で使用されます。
AngularJSインスタンス
<！Doctype html> <HTML> <head> <meta charset = "utf-8"> <script src = "http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"> </scrip> </head> <body> <div ng-app = "" " ng-init = "names = [{name： 'jani'、country： 'norway'}、{name： 'hege'、country： 'sweden'}、{name： 'kai'、country： 'denmark'}]"> <p> loopオブジェクト：</p> <ul> <li ng-repeat = " }} </li> </ul> </div> </body> </html>ループオブジェクト：
Noteangularjsは、データベースCRUDを完全にサポートしています（作成、読み取り、更新、更新、削除削除、削除の削除）アプリケーションを完全にサポートしています。
インスタンスのオブジェクトをデータベースに記録してください。
ng-appコマンド
NG-APP指令は、AngularJSアプリケーションのルート要素を定義します。
NG-APPディレクティブは、Webページがロードされたときにアプリケーションを自動的に起動（自動イニテリアル化）します。
後で、ng-appが値（ng-app = "mymodule"など）を介してコードモジュールに接続する方法を学びます。
ng-initディレクティブ
NG-Initディレクティブは、AngularJSアプリケーションの初期値を定義します。
通常、ng-initは使用されません。代わりにコントローラーまたはモジュールを使用します。
後でコントローラーとモジュールの詳細をご覧ください。
ng-modelコマンド
ng-modelディレクティブは、HTML要素をアプリケーションデータにバインドします。
ng-model指示も次のとおりです。
アプリケーションデータにタイプ検証（番号、電子メール、必須）を提供します。
アプリケーションデータに状態（無効、汚れ、触れられた、エラー）を提供します。
HTML要素のCSSクラスを提供します。
HTML要素をHTMLフォームにバインドします。
NG-Reepeatディレクティブ
NG-Reepeatディレクティブは、コレクション内の各アイテムに対して1回（配列内）に1回HTML要素をクローンします。
カスタムディレクティブを作成します
AngularJSの組み込みディレクティブに加えて、カスタムディレクティブを作成することもできます。
。方向関数を使用して、カスタムディレクティブを追加できます。
カスタムディレクティブを呼び出すには、HTML要素にカスタムディレクティブ名を追加する必要があります。
Camel Methodを使用して指令、RunoObdirectiveに名前を付けますが、それを使用する場合は、RunooB指向性を分割する必要があります。
AngularJSインスタンス
< ng-app = "myapp"> <runoob-directive> </runoob-directiont> <script> var app = angular.module（ "myApp"、[]）; app.directive（ "runoObdirectiont"、function（）{return {template： "custom Directive！"};}実行結果：
カスタムコマンド！
次の方法で指令を呼び出すことができます。
要素名
財産
クラス名
コメント
次の例は、同じ結果を出力することもできます。
要素名
< ng-app = "myapp"> <runoob-directive> </runoob-directiont> <script> var app = angular.module（ "myApp"、[]）; app.directive（ "runoObdirectiont"、function（）{return {template： "custom Directive！"};}実行結果：
カスタムコマンド！
財産：
<！doctype html> <html> <head> <meta charset = "utf-8"> <script src = "http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"> </scrip> </head> runoob-directive> </div> <scrip> var app = angular.module（ "myapp"、[]）; app.directive（ "runoobdirective"、function（）{return {custom directive！ "};}）; </script> </body> </body> </html>実行結果：
カスタムコマンド！
クラス名：
<！Doctype html> <html> <head> <meta charset = "utf-8"> <script src = "http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"> </scrip> </head> angular.module（ "myApp"、[]）; app.directive（ "runoObdirectiont"、function（）{return {restrict： "c"、 "c"！ "};} </p> </body> </html>カスタムコマンド！
注：クラス名でディレクティブを呼び出すには、「C」に制限の値を設定する必要があります。
注：
<！Doctype html> <html> <head> <meta charset = "utf-8"> <script src = "http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"> </scrip> </head> app = angular.module（ "myapp"、[]）; app.directive（ "runoobdirectiont"、function（）{return {restrict： "m"、fally、template： "custom Directive！"};} </p> <p> <strong>注：</strong>コメントを通じて指令を呼び出すには、<b>制限</b>を「m」に設定する必要があります。 </p> </body> </html>実行結果：
カスタムコマンド！
注：このインスタンスに交換属性を追加する必要があります。そうしないと、コメントが表示されません。
注：コメントを通じて指令を呼び出すには、制限の値を「M」に設定する必要があります。
制限された使用
指令を特定の方法でのみ呼び出すように制限できます。
例
制限プロパティを追加し、値のみを「A」に設定することにより、コマンドは属性を介してのみ呼び出すことができます。
例コード：
<！doctype html> <html> <head> <meta charset = "utf-8"> <script src = "http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"> </scrip> </head> <body ng-app = "myapp"> <runoob-directive> </runoob-direction> <div runoob-direction> </div> <script> var app = angular.module（ "myApp"、[]）; directive（ "runoobdirectiont"、function（）{return {restribt： "" a "、" a "、" a "、" a "、" a "、" a "、" a "、" a "、" a "、" a "、" a " };}）; </script> <p> <strong>注：</strong>ディレクティブの設定は、<strong>制限</strong>属性値を「a」に設定することにより、HTML要素の属性を介してのみ呼び出すことができます。 </p> </body> </html>実行結果：
カスタムコマンド！
注：設定コマンドは、制限属性値を「a」に設定することによってのみ呼び出すことができます。
制限値は次のとおりです。
e要素名のみを使用します
プロパティは利用可能です
cクラス名のみを使用します
Mはコメントでのみ利用できます
制限のデフォルト値はEAです。つまり、コマンドは要素名と属性名を介して呼び出すことができます。
上記はAngularjsの指導情報の編集であり、後で補足され続けます