我正在尝试创建一个指令来创建自定义掩码输入框。我知道还有其他库可以使用，但有时候我需要根据公司的需要创建自定义输入框（例如"OS.012-08765"），所以我宁愿创建自己的指令。

到目前为止，我能够按我需要的模式格式化数字，但在输入框上没有格式化，只有在模型上。对于这个例子，我将使用货币输入框，因为它更容易使用（我认为）。这是我正在使用的代码：

function myMoney() {
    return {
        restrict: 'A',
        require: 'ngModel',
        link: function(scope, element, attr, ngModelCtrl) {
            ngModelCtrl.$formatters.push( formatInput );
            ngModelCtrl.$render = renderViewValue;
            ngModelCtrl.$parsers.push( parseOutput );


            function formatInput( value ) {
                value = formatNumber(value);
                return value;
            }
            function parseOutput( value ) {
                value = formatNumber(value);
                return value;
            }
            function renderViewValue() {
                element.html( ngModelCtrl.$viewValue );
            }

            function formatNumber(value) {
                if(!value) {
                    value = '000';
                }

                var checkValue = value.replace(/[^0-9\.]/g, '');
                if(checkValue != value) {
                    value = checkValue;
                }

                value = value.toString();

                if(value.length < 3) {
                    value = ('000'+value).slice(-3);
                }

                var 
                    firstChar = value.slice(0, value.length-2),
                    lastChar  = value.slice(-2),
                    firstChar = Number(firstChar).toLocaleString(),
                    finalChar = '$'+firstChar+','+lastChar;

                return finalChar;
            }
        }
    }
}

这是一个包含该代码的plunkr: http://plnkr.co/edit/UjZkPFL0V4FRrDUL9jAJ?p=preview

主要问题在输出结果的地方，如果你开始在输入框中键入，该值没有掩码，只有数字。但是模型具有正确的掩码。

因此，基于此，我有两个主要问题：

• 第一：我希望颠倒这些结果。我想在文本框中输入并在文本框中使用掩码，而模型只是普通的数字（没有掩码）。
• 第二：如果我创建一个按钮来更新模型上的值，它不会在掩码中格式化，而是保持为纯文本。

如何解决这些问题？