Angular service to handle form input elements

In the previous post, we have seen how the datatype mismatch cause an error in HTML5 Angularjs Form. We have see the remedy to remove those errors. Each time when we send and $http request to insert and item to MySQL database we have to convert the data according to the data format accepted by the database. If in our form has less number of input fields then we can change the data format of form data submit to server by converting each value.

It is tedious to convert the data format for each input field if we have many input to handle. In that situation, we will make our code dirty and less maintainable and readable. To overcome all these type of difficulties, we have created an angular service to tackle it. Let's see the code for our angular service named $convertor:
$convertor Service:

var app = angular.module('myApp',[]);
app.factory('$convertor',['dateFilter',function(dateFilter){
  return{
    convertForSQL : convertForSQL,
    convertForHTML5 : convertForHTML5
  };

  function convertForSQL(obj){
    var o = angular.copy(obj);
    angular.forEach(o, function(value, key){
      if(angular.isDate(value)){
        o[key] = dateFilter(value,'yyyy-MM-dd');
      }
    });
    return o;
  }

  function convertForHTML5(o){
    angular.forEach(o, function(value, key){
      if(isValidDate(value)){
        o[key] = new Date(value);
      }
      if(isValidNumber(value)){
        o[key] = parseFloat(value);
      }
      if(angular.isObject(value) || angular.isArray(value)){
        o[key] = convertForHTML5(value);
      }
    });
    return o;
  }

  function isValidDate(dateString) {
    var regEx = /^\d{4}-\d{2}-\d{2}$/;
    if(!dateString.match(regEx)) 
      return false;  // Invalid format
    var d = new Date(dateString);
    if(!d.getTime()) 
      return false; // Invalid date (or this could be epoch)
    return d.toISOString().slice(0,10) === dateString;
  }

  function isValidNumber(numberString){
    var regEx = /^[+-]?((\.\d+)|(\d+(\.\d+)?))$/;
    if(!numberString.match(regEx)) 
      return false;
    return true;
  }
}]);

The $convertor service has a two functions:
#1. convertForSQL - This function is used to convert the angular form data to be accepted by the MySQL database. This method is called before the data passed to $http configuration data value. See below:

 data : $httpParamSerializerJQLike( $convertor.convertForSQL(data) )

#2. convertForHTML5 - This method is used to convert the JSON object to make it accepted by angular form inputs. This is called on the response data return by the $http call. See below:

 $http({...})
  .then(
    function(response){
      $scope.response = $convertor.convertForHTML5(response.data);
  });

How to use $convertor service:
The $convertor service is to be injected into controller for using it. Here is code for complete usage:

app.controller('myAppCtrl', function($scope, $http, $convertor, $httpParamSerializerJQLike){
  $scope.formData = {};
  $scope.response = {};

  $scope.submitForm = function(){
    var item = $convertor.convertForSQL($scope.formData);
    $http({
      method : 'POST',
      url : 'process.php',
      data : $httpParamSerializerJQLike(item),
      headers : {'Content-Type':'application/x-www-form-urlencoded'}
    })
      .then(
        function(response){
          $scope.response = $convertor.convertForHTML5(response.data);
      });
  };
});

Happy Coding :)