Форматирование ввода с угловым делает его только для чтения

Question

Итак, у меня есть модель с именем policyEngine, и есть числовое поле с именем netPrem

У меня так, поэтому оно показывает валюту с десятичными знаками.

<input class="form-control" name="policyNet"  type="text"
       data-ng-model="QuoteEngineController.policyEngine.netPrem | currency : QuoteEngineController.currency : 2" />

Значение показываеткак мне нравится £ 5 968,63

но я не могу его изменить ..?

Спасибо

Answer 1

Это мое решение, директива, которая привязывается к модели внешних контроллеров (десятичная) и отображает ее в виде строки конфет.Когда пользователь изменяет строку, это обновляет модель, снова преобразовывая ее в десятичную.

module CompanyNameHere {
export function showCurrencyInput(): ng.IDirective {
    return {
        restrict: 'E',
        replace: true,
        template: "<input class='form-control' name=''name'' type='text' ng-model='modelAsString' />",
        scope: {
            model: '=',
            currency: '=',
            name:'=',
            modelAsString: '&',
        },
        link: function (scope: any) { 

            scope.modelAsString = "";

            scope.$watch('model', function (newValue:number, oldValue:number) {

                //put number in eye fiendly string
                if (newValue != null && !isNaN(newValue)) {    
                    var name = scope.name;
                    var currency = scope.currency;                        
                    //number to string
                    var test = newValue.toString();
                    test = test.replace(/\B(?=(\d{3})+(?!\d))/g, ",");
                    test = currency + test;
                    scope.modelAsString = test;
                }

            });
            scope.$watch('modelAsString', function (newValue: string, oldValue: string) {

                //put string value back in the number (this goes back to server)
                if (newValue != null) {                       

                    var name = scope.name;
                    var numAsString = newValue;                                                                       
                    //get rid of non numeric characters
                    numAsString = numAsString.replace(/[^0-9.]/g, '');
                    var inputAsNum = parseFloat(numAsString);                        
                    scope.model = inputAsNum;              
                }

            });
        }
    };
}
angular.module("App").directive("showCurrencyInput", showCurrencyInput);

}