AngularJS forms and controls can provide validation capabilities and warn against illegal data entered by the user.
Note: client-side validation does not ensure that user input data is secure, so data validation on the server is also required.
<!DOCTYPE HTML><HTML> <Head> <MetaCharSet= "Utf-8"> <Scriptsrc= "Http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"></Script> </Head> <Body> <H2>Verifying instances</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 e-mail address.</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>
The HTML form property novalidate is used to disable browser default validation.
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 .
Http://www.cnblogs.com/chrisghb8812/p/5643470.html
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 Input Validation