输入字段只接受正数，两位小数和十进制逗号，如何？

Question

我试图做一个只接受正数的指令，像欧洲人那样接受小数的逗号，在该输入字段中接受两位小数。

没有成功。

我对AngularJS很新，尤其是像这样的指令。

您是否有人想过或尝试如何实现此目标？

使用此指令的输入字段应仅接受正数而不是任何字符或其他符号，以逗号表示需要两个十进制数。

EG。 123.34 =＆gt; 123,34或123.345 123,34等。

我在从某种领域失去焦点后尝试了编辑和格式化。

周围的样品？

Br Michael

Answer 1

它不是你想要的，但这是方向：

这里我们添加逗号，用户只能输入整数。

fessmodule.controller('fessCntrl', function ($scope) {
    $scope.test = 123456879;
});

fessmodule.$inject = ['$scope'];


fessmodule.directive('format', ['$filter', function ($filter) {
    return {
        require: '?ngModel',
        link: function (scope, elem, attrs, ctrl) {
            if (!ctrl) return;

            ctrl.$formatters.unshift(function (a) {
                return $filter(attrs.format)(ctrl.$modelValue)
            });

            ctrl.$parsers.unshift(function (viewValue) {
                var plainNumber = viewValue.replace(/[^\d|\-+|\.+]/g, '');
                elem.val($filter('number')(plainNumber));
                return plainNumber;
            });
        }
    };
}]);

演示 Fiddle

Answer 2

你想做的事情并非无足轻重。

有许多本地化注意事项，在解析数字以将其返回到模型时会产生很多影响。虽然Angular具有number过滤器形式的格式化程序，但它目前没有解析器。因此，处理来自文本输入的任意输入将不会令人愉快。

在Angular之前，我花了很多时间为一家银行机构开发这样的JavaScript实现，而且它表面上的工作要多得多。

事实上，对于这类事情，轻松获胜将利用角度数字或货币过滤器输出标准数字输入旁边的“预览”类别：

<input type="number" step="0.01" ng-model="foo"/> 
<output>{{ foo | number: 2 }}</output>

或

<input type="number" step="0.01" ng-model="foo"/> 
<output>{{ foo | currency }}</output>

这里的优势是Angular将为您处理本地化。我想，你甚至可以在输入聚焦时显示/隐藏输出。