角度材料输入数字更改格式

时间:2017-08-14 16:25:49

标签: javascript angularjs angular-material

在我的angular-material应用程序中,我有一个验证字段:

<input type="number" ng-model="myValue"
       name="myValue" 
       min="0" max="100" 
       ng-pattern="/^[0-9]\d*(\.\d+)?$/" required>

工作正常。但现在我需要让它允许用户键入.75并获得而不是0.75

所以问题如何应用我的过滤器:

if( myValue.substring(0,1) == "." ){
    myValue = "0" + myValue;
}
在角材料ng-patterntype="number"验证

之前

1 个答案:

答案 0 :(得分:1)

您可以使用$filter$formatters$parsers撰写一些指令:

app.directive('parser', ['$filter',
    function($filter) {
        return {
            restrict:'A',
            require: 'ngModel',
            link: function(scope, element, attrs, ctrl) {

                ctrl.$formatters.unshift(function (a) {
                return $filter('myFilter')(ctrl.$modelValue)
            });

             ctrl.$parsers.unshift(function (viewValue) {
             element[0].value = $filter('myFilter')(element[0].value);
             return element[0].value;
            });
            }
        };
    }
]);

app.filter('myFilter', [
    function() {
        return function(input) {

           if( input && input.substring(0,1) == "." ){
             input = "0" + input;
           }
            return input;
        };
    }
]);

DEMO Plunkr

但是你不能使用number类型,因为我记得.不支持并且不会解析为整数

希望它会给你指路