JSFiddle - React, Tailwind, and code Playground

HTML

<div ng-app="myApp" ng-controller="myCtrl">
    <form name="myForm">
        <input type="text" ng-model="telephone" phoneformat  name="input1" />
         <span class="error" ng-show="myForm.input1.$error.telephone">Numbers only!</span>
        <span class="error" ng-show="myForm.input1.$error.telephone">Exact 10 Numbers only!</span>
             
    </form>
</div>

JavaScript

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

var myCtrl = myApp.controller("myCtrl",["$scope", function($scope) {
    $scope.telephone = "1234567890";
}]);

myApp.directive("phoneformat", function () {
    return {
        restrict: "A",
        require: "ngModel",
        link: function (scope, element, attr, ngModelCtrl) {
            var phoneformat = function () {
                
            }
           
        }
    };
});