使用 ng-model 输入框中的 Angularjs 货币格式：如何让 $formatters 在每个输入上触发

我到处寻找这个。每个堆栈溢出都有一个答案，但它实际上不起作用。与 Angular 的任何示例或谷歌组示例相同，包括文档。

看起来很简单。我希望在用户按下的每个键的输入上调用一个函数。

使用 ng-model 进行简单输入

<input class="form-control" ng-model="model.thisisnotfun" formatter type="text" required>

根据我读到的一切。 $formatters 应该将值从模型更新到调用 $formatters 数组中的任何函数的视图。当我在输入框中键入内容时，他们永远不会被调用。

.directive('formatter', function ($filter, $parse) {
    return {
        require: 'ngModel',

        link: function (scope, element, attrs, ngModel) {

            ngModel.$formatters.push(
                function (value) {
                    console.log('this only gets called on page load');
                }
            );
        }
    };
})

我知道有很多自定义方法可以做到这一点，我已经这样做了。我不需要解决方法，我只是想知道如何正确使用 $formatters 来“格式化”视图数据。

非常非常简单的jsfiddlehttp://jsfiddle.net/fh7sB/4/ http://jsfiddle.net/fh7sB/4/

谢谢你的帮助。

我无法让 $formatters 函数像我想要的那样工作。我也找不到我在任何地方寻找的示例，因此我将发布我的答案，以防有人需要。

这是使用 ng-model 在输入框中格式化我们货币的指令

    .directive('uiCurrency', function ($filter, $parse) {
    return {
        require: 'ngModel',
        restrict: 'A',
        link: function (scope, element, attrs, ngModel) {

            function parse(viewValue, noRender) {
                if (!viewValue)
                    return viewValue;

                // strips all non digits leaving periods.
                var clean = viewValue.toString().replace(/[^0-9.]+/g, '').replace(/\.{2,}/, '.');

                // case for users entering multiple periods throughout the number
                var dotSplit = clean.split('.');
                if (dotSplit.length > 2) {
                    clean = dotSplit[0] + '.' + dotSplit[1].slice(0, 2);
                } else if (dotSplit.length == 2) {
                    clean = dotSplit[0] + '.' + dotSplit[1].slice(0, 2);
                }

                if (!noRender)
                    ngModel.$render();
                return clean;
            }

            ngModel.$parsers.unshift(parse);

            ngModel.$render = function() {
                console.log('viewValue', ngModel.$viewValue);
                console.log('modelValue', ngModel.$modelValue);
                var clean = parse(ngModel.$viewValue, true);
                if (!clean)
                    return;

                var currencyValue,
                    dotSplit = clean.split('.');

                // todo: refactor, this is ugly
                if (clean[clean.length-1] === '.') {
                     currencyValue = '$' + $filter('number')(parseFloat(clean)) + '.';

                } else if (clean.indexOf('.') != -1 && dotSplit[dotSplit.length - 1].length == 1) {
                    currencyValue = '$' + $filter('number')(parseFloat(clean), 1);
                } else if (clean.indexOf('.') != -1 && dotSplit[dotSplit.length - 1].length == 1) {
                    currencyValue = '$' + $filter('number')(parseFloat(clean), 2);
                } else {
                     currencyValue = '$' + $filter('number')(parseFloat(clean));
                }

                element.val(currencyValue);
            };

        }
    };
})