According to dnc253, your implementation of the ng-switch
logic is not correct. The solution provided below will help you achieve the desired functionality.
http://jsfiddle.net/ud3323/AbmsG/7/
HTML
<form ng-app="someApp" name="form" ng-controller="MainCtrl">
<input validate name="EmailAddress" ng-model="form.emailAddress" john len = "8" required />
<div class="errorDiv" ng-switch on="currentError">
<div ng-switch-when="required" style="color: black; background-color: yellow">required</div>
<div ng-switch-when="len" style="color: black; background-color: yellow">len</div>
<div ng-switch-when="john" style="color: black; background-color: yellow">john</div>
</div>
</form>
JS
angular.module('someApp', [])
.directive('validate', function() {
return {
require: 'ngModel',
link: function(scope, element, attrs, ctrl) {
element.bind("keydown keypress", function(event) {
if (event.which === 13) {
scope.$apply(function() {
scope.$eval(attrs.onEnter);
});
event.preventDefault();
}
});
ctrl.$parsers.push(function(value){
if (!value) value = '';
ctrl.$setValidity('required',
value != '');
ctrl.$setValidity('len',
value.length == 8);
ctrl.$setValidity('john',
value=='john');
return value;
});
}
}
}).controller('MainCtrl', ['$scope', function ($scope) {
$scope.$watch('form.$error', function (errorObject) {
if (errorObject.required) $scope.currentError = "required";
else if (errorObject.len) $scope.currentError = "len";
else if (errorObject.john) $scope.currentError = "john";
}, true);
}]);