関連する読み物:
AngularJS入門チュートリアル:AngularJS式
AngularJS入門チュートリアル:AngularJS指令
表現と指示に関する以前のチュートリアルでは、AngularJSモデル(NG-Model)が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> <div ng-app = ""> 'ng-app " <入力ng-model = "name"> </div> </body> </html>
双方向結合角度双方向結合とは、Ng-ModelのHTMLの入力ドメインとAngularjsの属性への結合を指します。したがって、入力ドメインの値が変更されると、AngularJの属性値も変更されます。
<!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 shoon";};それに応じて変更されます。 </p> </body> </html>アプリケーションステータスNG-Modelディレクティブは、アプリケーションデータのステータス値を提供できます。
データが変更されたときに汚れ、ステータスは真であり、falseに変更されていません。元の値に変更されたとしても、それは本当です。
有効な入力値は合法である場合は真であり、合法ではない場合は偽です。
falseのように触れることなく、TAUCKING TRUEとしてクリックするタッチスクリーンによって触れられます。
ステータスに応じてCSSスタイルを適用します
<!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 LightBlue;} </style> <body> <form ng-app = "" name = "myform"> neme:<input name = "myaddress" ng-model = "text" reby> </form> </body> </html>
入力フィールドは、必要な状態を追加します。入力フィールドに入力がない場合、NG-ModelはNG-Invalidスタイルを入力フィールドに追加します。それ以外の場合は、ng-validスタイルを削除します。 NG-Modelディレクティブは、フォームフィールドのステータスに従って次のスタイルを追加/削除します:-ng-empty-ng-not-not-ng-touched-ng-valid-ng-invalid-ng-dirty-ng-pending-ng-pristine使用ng-model
<!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> </body> </html>
myform.myaddress。$ error.email属性がtrue(メールボックス形式が間違っている場合)がある場合、ng-showはスパンコンテンツの表示を制御します。
上記のコンテンツは、AngularJS入門チュートリアルによって編集者によって紹介されたAngularJSモデルです。私はそれが誰にでも役立つことを願っています!