Angularjs Study Chapter (17)

AngularJSInput Validation

<!DOCTYPE HTML><HTML><Scriptsrc= "Http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"></Script><Body><H2>Validation Example</H2><formNg-app= "MYAPP"Ng-controller= "Validatectrl"name= "MyForm"novalidate><P>User name:<BR>  <inputtype= "text"name= "User"Ng-model= "User"Required>  <spanstyle= "Color:red"Ng-show= "Myform.user. $dirty && myform.user $invalid">  <spanNg-show= "Myform.user. $error. Required">The user name is required.</span>  </span></P><P>Mailbox:<BR>  <inputtype= "Email"name= "Email"Ng-model= "Email"Required>  <spanstyle= "Color:red"Ng-show= "Myform.email. $dirty && myform.email $invalid">  <spanNg-show= "Myform.email. $error. Required">The mailbox is required.</span>  <spanNg-show= "Myform.email. $error. Email">Illegal mailbox.</span>  </span></P><P>  <inputtype= "Submit"ng-disabled= "Myform.user. $dirty && myform.user $invalid | | Myform.email. $dirty && myform.email. $invalid "></P></form><Script>varapp=Angular.module ('myApp', []); App.controller ('Validatectrl', function($scope) {$scope. User= 'John Doe'; $scope. Email= '[email protected]';});</Script></Body></HTML>

Instance parsing

The AngularJS ng-model directive is used to bind input elements into the model.

The model object has two properties: user and email.

We used the ng-show directive and color:red the message is displayed $dirty or $invalid .

Properties	Description
$dirty	The form is filled with records
$valid	The contents of the field are valid
$invalid	The contents of the field are illegal
$pristine	form does not fill in records

Angularjs Study Chapter (17)