JSFiddle - React, Tailwind, and code Playground

by Mayank Dixit

HTML

<div ng-controller="mainCtrl">
    {{data}}
    <div ng-repeat="(x, data) in data[0]">
        <input type="text" ng-model="data.value" custom-validation/>
    </div>
</div>

JavaScript

angular.module("myApp", []).
controller("mainCtrl", function($scope){
    $scope.data = [{12: {"value": "data"}, 13: {"value": "mayank"}, 14: {"value": "sample"}}];
    
})
.directive('customValidation', function(){
   return {
     require: 'ngModel',
     link: function(scope, element, attrs, modelCtrl) {

       modelCtrl.$parsers.push(function (inputValue) {

         var transformedInput = inputValue.toLowerCase().replace(/ /g, ''); 

         if (transformedInput!=inputValue) {
           modelCtrl.$setViewValue(transformedInput);
           modelCtrl.$render();
         }         

         return transformedInput;         
       });
     }
   };
});