HTML 输入 - AngularJS - 不显示超过 3 位数字

Question

当我在输入框中输入 4 位数（不包括小数）或更多位数时，当我点击退出时，它突然从数字输入框中消失（模糊）。会不会是货币过滤器在做呢？

如果我将它记录到控制台，模型仍然保留该值，它只是从视图中消失。

<div class="input-group col-sm-2">
    <div class="input-group-addon">$</div>
    <input type="number" step="any" min="0" class="form-control" id="promoSetupFee" data-ng-model="fees.setup.promo" data-ng-format-curr data-ng-blur="updateSetupTotal()">
</div>

---

crtPromoDir.directive('ngFormatCurr', ['$timeout', '$filter', function($timeout, $filter)
{
    return {
        link: function(scope, element, attrs)
        {
            $timeout(function()
            {
                element.val($filter('currency')((element.val() || 0), '', 2));
            });

            element.blur(function()
            {
                element.val($filter('currency')((element.val() || 0), '', 2));
            });
        }
    };
}]);

编辑：似乎数字类型的 HTML 输入不接受逗号，有什么办法可以从我拥有的指令中删除逗号？

编辑：

$scope.updateSetupTotal = function()
{
    $scope.fees.setup.total = (parseFloat($scope.fees.setup.promo) || 0.00)+(parseFloat($scope.fees.setup.loc) || 0.00)+(parseFloat($scope.fees.setup.premium) || 0.00)+(parseFloat($scope.fees.setup.content) || 0.00);

    $scope.updatePromoTotal();
};

编辑：快速修复是使用类型文本而不是数字作为输入，但这意味着模型现在将是字符串而不是浮点数。

Answer 1

我通过使用亚历克斯答案的变体使其工作。基本上，由于currency 过滤器添加了逗号，因此我必须在应用该过滤器之后并将其发送到输入框之前立即将其删除。

crtPromoDir.directive('ngFormatCurr', ['$timeout', '$filter', function($timeout, $filter)
{
    return {
        link: function(scope, element, attrs)
        {
            $timeout(function()
            {
                element.val($filter('currency')((element.val() || 0.00), '', 2).replace(',',''));
            });

            element.blur(function()
            {
                element.val($filter('currency')((element.val() || 0.00), '', 2).replace(',',''));
            });
        }
    };
}]);

这使我可以将模型保持为 int 并避免使用字符串值。

Answer 2

要从字符串中删除逗号，请执行以下操作：

element.val($filter('currency')((element.val().replace(',','') || 0), '', 2));