AngularJSディレクティブは、HTMLを拡張するために使用されます。これらはすべて、NG-プレフィックスから始まる特別な特性です。次の指令について説明します。
NG -APP-この指令はAngularJSアプリケーションを開始します。
ng -init-この指令はアプリケーションデータを初期化します。
NG -Model-この指令は、AngularJSで使用される変数であるモデルを定義します。
NG -Reepeat -この指令は、コレクション内の各アイテムのHTML要素を繰り返します。
ng-appコマンド
NG-APP指令は、AngularJSアプリケーションを開始します。ルート要素を定義します。 AngularJSアプリケーションのWebページをロードするアプリケーションを自動的に初期化または起動します。また、さまざまなAngularJSモジュールAngularJSアプリケーションをロードするためにも使用されます。次の例では、DIV要素のNG-APP属性を使用してデフォルトのAngularJSアプリケーションを定義します。
<div ng-app = ""> ... </div>
ng-initディレクティブ
NG-Initディレクティブは、AngularJSアプリケーションのデータを初期化します。変数を使用するためにアプリケーションに値を配置するために使用されます。次の例では、国の配列を初期化します。 JSON構文を使用して、国の配列を定義します。
<div ng-app = "" ng-init = "国= [{locale： 'en-us'、name： 'United States'}、{locale： 'en-gb'、name： 'United'}、{locale： 'en-fr'、name： 'france'}]"> ... </div>ng-modelコマンド
NG-Modelディレクティブは、AngularJSアプリケーションで使用されるモデル/変数を定義します。次の例では、「name」というモデルを定義します。
<div ng-app = ""> ... <p>名前を入力してください：<入力型= "テキスト" ng-model = "name"> </p> </div>
NG-Reepeatディレクティブ
NG-Reepeatディレクティブは、HTML要素コレクションの各アイテムを繰り返します。次の例では、アレイ国を反復しました。
<div ng-app = ""> ... <p>ロケールを持つ国のリスト：</p> <ol> <li ng-repeat = "国の国"> {{'country：' + country.name + '、locale：' + country.locale}} </li> </ol> </div>例
次の例では、上記のすべての指示を示します。
testangularjs.html
<html> <title> angularjsディレクティブ</title> <body> <h1>サンプルアプリケーション</h1> <div ng-app = "" ng-init = "国= [{locale： 'en-us'、name： 'United States'}、{locale： 'en-gb'、name： 'perting'}、{localあなたの名前：<入力タイプ= "テキスト" ng-model = "name"> </p> <p> hello <span ng-bind = "name"> </span>！</p> <p>ロケールのある国のリスト：</p> <ol> <li ng-repeat = "国の国"> {{'国：' + country ' + country + </ol> </div> <Script src = "http://ajax.googleapis.com/ajax/libs/angularjs/1.2.15/angular.min.js"> </scrip> </body> </html>出力
WebブラウザでTextangularjs.htmlを開きます。名前を入力して、次の結果を確認してください。
上記は、AngularJS指令の基本情報です。今後も関連情報を追加し続けます。このサイトへのご支援ありがとうございます！