Home > Developer > Web Develop
Index.html
1<!doctype html>234<meta charset="Utf-8">56<style>7 /*Input.ng-invalid {8 border:1px solid red;9 }Ten Input.ng-valid { One border:1px solid Green; A }*/ -</style> -<script src="Js/angular.js"></script> the<script src="Js/clock.js"></script> -<script src="Js/angular-messages.js"></script> -<script src="Js/angular-messages.min.js"></script> -<body ng-app="myApp"> +<form name="Form1"Novalidate ng-submit="Signupform ()"Ng-controller="Signupcontroller"> -<label>your name</label> +<input type="text"Placeholder="Name"Ng-model="name"Name="name"Ng-minlength="3" ANg-maxlength=" -"Required > at<divclass="Error"ng-messages="form1.name. $error"> -<my-error></my-error>
-</div> -<button type="Submit">Submit</button> -</form> -</body> inClock.js
1 varApp=angular.module ('myApp',['ngmessages']);2App.directive ('Myerror', function () {3 return{4Restrict' EAC',
5Template'<div ng-message= "required" > Please enter user name </div> <div ng-message= "minlength" > less than 3-bit </div> <div Ng-message= "MaxLength" > extra 20 bits </div>'6 }7})E represents the element a for the attribute C represents the class m for the comment
<my-error></my-error> can be replaced by <div my-error></div>
Angularjs Form validation ngmessages and creating custom directives combine
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
