var app = angular.module('form-example1', ['validation']);
var INTEGER_REGEXP = /^\-?\d+$/;
app.controller("Controller", function ($scope, Validations) {
angular.extend($scope, Validations);
});
app.factory('Validations', function ($timeout) {
return {
disposableMail: function (email) {
if (!email) return true;
return email.indexOf('@mailinator.com') >= 0 ? false : true;
},
spamWarning: function (email) {
if (!email) return true;
return email.indexOf('@hotmail.com') >= 0 ? false : true;
},
duplicateMailRemoteCheck: function (email) {
return $timeout(function () {
return ['[email protected]', '[email protected]', '[email protected]'].indexOf(email) >= 0 ? false : true;
}, 2000);
}
};
});
<div class="container-fluid" ng-app="form-example1">
<div ng-controller="Controller" class="row">
<form name="form" class="form-horizontal col-md-12" novalidate>
<div class="form-group">
<label for="uname" class="col-md-2 control-label">User Name</label>
<div class="col-md-10">
<input type="text" ng-model='userName' name='uname' required class="form-control" />:{{userName}}
<div validation-messages model-controller='form.uname' required-error="User name is required."></div>
</div>
</div>
<div class="form-group">
<label for="email" class="col-md-2 control-label">User Email (Custom + Remote Validator + On Blur)</label>
<div class="col-md-10">
<input type="email" ng-model='userEmail' name='email' required class="form-control" custom-validator="disposable,spam" validate-functions='disposableMail,spamWarning' custom-remote-validator="duplicate" remote-validate-functions="duplicateMailRemoteCheck" update-on-blur/>:{{userEmail}}
<div validation-messages model-controller='form.email' required-error="Email id is required." email-error="Email is not in correct format." disposable-error="We do not accept disposable email ids." spam-error="At present we are not accepting hotmail.com domain ids." duplicate-error="This mail id already exists in our db."></div>
</div>
</div>
<div class="form-group">
<label for="size" class="col-md-2 control-label">Size (integer 0 - 10):</label>
<div class="col-md-10">
<input type="number" ng-model="size" name="size" min="0" max="10" integer required class="form-control" />{{size}}
<div validation-messages model-controller='form.size' min-error="Value should be greated or equal to zero." max-error="Max allowed is 10." integer-error="Should be integer" number-error="Should be number" required-error="input is required."></div>
</div>
</div>
</div>
</form>
</div>
</div>
External resources loaded into this fiddle: