customvalidation.js

sampleApp.directive('myUsername', [ function(){
 // Runs during compile
 return {
   require: 'ngModel',
   restrict: 'A', 
   link: function($scope, iElm, iAttrs, controller) {
                        
     controller.$parsers.unshift(function(value){
     //allow only alphanumeric characters
     var reg = /^\w+$/ ;
     var isValidUsername = reg.test(value);
     controller.$setValidity('username',isValidUsername);
       return isValidUsername? value:undefined;
   });

     controller.$formatters.unshift(function(value){
       var reg = /^\w+$/ ;
       var isValidUsername = reg.test(value);
       controller.$setValidity('username',isValidUsername);
       $scope.registrationForm.username.$setViewValue($scope.registrationForm.username.$viewValue);
       return value;
    })
   }
  };
}]);

form.html

<input type="text" name="username" ng-model="userData.username" ng-model-options="{updateOn: 'blur'}" my-username>&nbsp;&nbsp;
<span ng-show="registrationForm.username.$dirty && registrationForm.username.$error.username">
   Invalid Username.
</span>