Angular Validator - Right way to do validation in AngularJs. This module provides a very clean and efficient way of doing Form validation by extending ngModelController and ngFormController.
Download the production version or the development version
In your web page:
<script src="angular.js"></script>
<script src="dist/angular-validator.min.js"></script>OR
bower install angular-form-validator
OR from github as
bower install marshal003/git@github.com:marshal003/angular-validator.git- Install component by following one of the above mentioned step.
- Inject
hiComponents.validatormodule as dependency in your angular app. eg.var app = angular.module('myApp', ['hiComponents.validator'])
- Thats all, now you can define your validation rules and register them with validator component and directly use them in HTML. e.g.
Register Your Validation Rules
app.controller('mainCtrl', ['$scope', 'hiValidatorService', function($scope, hiValidatorService){
$scope.user = {};
// My Validation Rules
var passwordValidation = function(value) {
var passRegex = /^(?=.*[A-Za-z])(?=.*\d)[A-Za-z\d]{8,}$/;
if(!passRegex.test(password)) {
return {isValid: false, errorMessage: "Password must have minimum 8 characters with at least 1 alphabet & 1 numeric"};
}
return {isValid: true};
}
// Register this rule with service
hiValidatorService.register(passwordValidation, 'validatePassword');
}]);Now, you can use the registered validation in HTML as -
<div ng-controller='mainCtrl'>
<form name='sampleForm'>
<div class='form-group'>
<input type='password' hi-validate='validatePassword' class='form-control' ng-model='user.pasword'>
<hi-validator-message data-model='password'></hi-validator-message>
</div>
</form>
</div>Other Examples are coming soon...