Angularjs ng-modelディレクティブ
NG-Modelディレクティブは、アプリケーションデータをHTMLコントローラー（入力、Select、Textarea）の値にバインドするために使用されます。
ng-modelコマンド
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"> </script> </head> <body> <div ng-app ">" ">"> ">" <入力ng-model = "name"> </div> <script> var app = angular.module（ 'myApp'、[]）; app.controller（ 'myctrl'、function（$ scope.name = "john doe";}）; </script> <p> ng-model directiveを使用してコントロールの価値を投入するためにng-model directiveを使用します。 </p> </body> </html>
実行結果：
名前：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"> </script> </head> <body> <div ng-app ">" ">"> ">" <入力ng-model = "name"> <h1>入力した：{{name}} </h1> </div> <script> var app = angular.module（ 'myapp'、[]）; app.controller（ 'myctrl'、function（$ scope）{$ scope.name = "john doe";それに応じて名前も変更されます。 </p> </body> </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> < name = "myAddress" ng-model = "text"> <span ng-show = "myform.myaddress。$ error.email">法的なメールアドレスではありません</span> </form> <p>入力ボックスにメールアドレスを入力します。それが法的な電子メールアドレスでない場合、迅速なメッセージが表示されます。 </p> </body> </html>
実行結果：
メール：
入力ボックスにメールアドレスを入力します。それが法的な電子メールアドレスでない場合、迅速なメッセージが表示されます。
CSSクラス
NG-Modelディレクティブは、状態に基づいてHTML要素のCSSクラスを提供します。
AngularJSインスタンス
<！Doctype html> <html> <head> <meta charset = "utf-8"> <script src = "http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"> </script.ng-invalid {background-color： LightBlue;} </style> </head> <body> <form ng-app = "" name = "myform"> neme name：<input name = "myname" ng-model = "mytext" reby> </form> <p>異なる状態の背景色が変化に送られます。 </p> <p>必要な属性がテキストフィールドに追加されますが、これは必要です。空の場合は違法です。 </p> </body> </html>実行結果：
テキストフィールドを編集すると、さまざまな状態の背景色が変更されます。
テキストフィールドには必要なプロパティが追加されていますが、これには必要であり、空の場合は違法です。
NG-Modelディレクティブは、フォームフィールドのステータスに従って次のクラスを追加/削除します。
ng-empty
ng-not-empty
ng-touched
ng-untouched
ng-valid
ng-invalid
ng-dirty
ng-pending
Ng-Pristine