How can i write dynamic angularjs directive for validate?

Question

I am newbie in angularjs, and I have a question. I want to write only a directive for validate all types data (string, number,etc).

I wrote in JSFIDDLE,you can visit here: http://jsfiddle.net/wk8rbot5/5/, it worked.

But I dont want to use if-else to much in this file. I think we can use type or regex from other file. So anyone has suggestion, please let me know. Thank you so much.

var app = angular.module("app",[]);

app.controller("FormCtrl", function($scope) {   
  $scope.data = {};
  $scope.action = function() {
    debugger
    console.log($scope.data);
  }
});

app.directive("allowPattern", function() {
  return {
    restrict: "A",
    require: "ngModel",
    link: function(scope, el, attrs, ngModel) {
      var validator, patternValidator,
          validType = attrs.allowPattern,
          required = true;
      var pattern = "";
      if( validType =="email" ) {
        pattern = new RegExp(/^[A-Za-z0-9_-]+([\.]?[A-Za-z0-9_-])*@\w+([-.]\w+)*\.\w+([-.]\w+)*$/);
      }
      else if(validType =="onlynumber"){
        //do other validate here
        pattern = new RegExp(/^[0-9]*$/);
      } else{
        parttern = new RegExp(/^.*S/); // !!! SyntaxError is fixed in this line
      }

      patternValidator = function(value) {
        return validate(pattern, value)
      };

      ngModel.$formatters.push(patternValidator);
      ngModel.$parsers.push(patternValidator);

      attrs.$observe("required", function(newval) {
        required = newval;
        patternValidator(ngModel.$viewValue);
      });

      function validate(regexp, value) {
        if( value == null || value === "" || !required || regexp.test(value) ) { // !!! TypeError: regexp.test is not a function 
          ngModel.$setValidity('pattern', true);
          return value;
        }
        else {
          ngModel.$setValidity('pattern', false);
          return;
        }
      }
    }
  };
});

<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.5.6/angular.min.js"></script>

<div ng-app="app" ng-controller="FormCtrl">
  <form name="theForm" novalidate="novalidate">
    <input type="text" ng-model="data.name" allow-pattern="email" required/>
    <button ng-disabled="theForm.$invalid" ng-click="action()">Action</button>
  </form>

  <br>
  other form:
  <br>
  <form name="theForm2" novalidate="novalidate">
    <input type="text" ng-model="data.number" allow-pattern="onlynumber" required/>
    <button ng-disabled="theForm2.$invalid" ng-click="action2()">Action</button>
  </form>

  <br>
  other form 3 :
  <br>
  <form name="theForm3" novalidate="novalidate">
    <input type="text" ng-model="data.abc" allow-pattern="" required/>
    <button ng-disabled="theForm3.$invalid" ng-click="action3()">Action</button>
  </form>
</div>