Home
Run >
<!DOCTYPE html> <html> <head> <!-- www.techstrikers.com --> <title>AngularJS ngMessageExp Sample</title> <script src="https://www.techstrikers.com/AngularJS/Includes/angular.min.js"></script> <script src="https://www.techstrikers.com/AngularJS/Includes/angular-messages.js"></script> <script type="text/javascript"> var app = angular.module('ngMessagesExpExample') app.controller('testngMessagesExp', function ($scope) { $scope.example = { name: '' } }); </script> </head> <body ng-app="ngMessagesExpExample" ng-controller='testngMessagesExp'> <fieldset style="background-color:#DDE4E9;"> <legend>AngulerJS ngMessageExp Example</legend> <form name="myForm"> <div style="font-family:Arial;margin:10px;width:350px;"> <label>Enter Name:</label> <input type="text" placeholder="Max 10 characters" ng-model="example.name" name="myName" minlength="3" maxlength="10" required /><br> </div> <div ng-messages="myForm.myName.$error"> <div style="font-family:Arial;color:red;background:steelblue;padding:3px;width:350px;" ng-message="required">Enter Name</div> <div style="font-family:Arial;color:red;background:steelblue;padding:3px;width:350px;" ng-message-exp="['minlength', 'maxlength']">Name must be between than 3 and 10 characters</div> </div> </div> </form> </fieldset> </body> </html>