Input type number and maxlength fix

A fix for input type number and maxlength for AngularJS.

HTML

<!-- stitch this with the module declare in Javascript -->
<body ng-app="myApp">
    <div ng-controller="InputCtrl">
        <table>
            <tr>
                <td>This works. (input="text" + maxlength)</td>
            </tr>
            <tr>
                <td>
                    <input type="text" ng-model="input1" maxlength="10"/>
                </td>
            </tr>
            <tr>
                <td>This doesn't. (input="number" + maxlength)</td>
            </tr>
            <tr>
                <td>
                    <input type="number" ng-model="input2" maxlength="10"/>
                </td>
            </tr>
            <tr>
                <td>Therefore uses this. (input="number" + maxlength + directives)</td>
            </tr>
            <tr>
                <td><input type="number" ng-model="input3" maxlength="10" input-max-length-number/></td>
            </tr>
        </table>
    </div>
</body>

JavaScript

// declare a module
var myApp = this.angular.module('myApp', []);

// declare a controller
myApp.controller('InputCtrl', function ($scope) {
    
});

myApp.directive('inputMaxLengthNumber', function() {
  return {
    require: 'ngModel',
    restrict: 'A',
    link: function (scope, element, attrs, ngModelCtrl) {
      function fromUser(text) {
        var maxlength = Number(attrs.maxlength);
        if (String(text).length > maxlength) {
          ngModelCtrl.$setViewValue(ngModelCtrl.$modelValue);
          ngModelCtrl.$render();
          return ngModelCtrl.$modelValue;
        }
        return text;
      }
      ngModelCtrl.$parsers.push(fromUser);
    }
  };
})