Формат входного значения в Angularjs

Question

Я пытаюсь написать директиву, которая автоматически форматирует число в <input>, но модель не отформатирована. Как работать, это нормально, при загрузке значение на входе отображается как 1 000 000 и 1000000 в контроллере, однако при вводе только ngModel.$parsers срабатывает функция. Единственный раз, когда ngModel.$formatters огонь, когда директива загружается и, если значение равно 0.

Как я могу заставить его работать на нажатие клавиши (я пытался связывание с/KeyUp при нажатии на кнопку, но она не работает) ,

Вот мой код:

angular.module('myApp.directives', []).directive('filterInput', ['$filter', function($filter) { 
    return { 
     restrict: 'A', 
     require: 'ngModel', 
     link: function(scope, element, attr, ngModel) { 

      ngModel.$parsers.push(function fromUser(text) { 
       return parseInt(text.replace(",", "")); 
      }); 

      ngModel.$formatters.push(function toUser(text) { 
       console.log($filter('number')(text)); 
       return ($filter('number')(text || '')); 
      }); 

     } 
    }; 
}]); 

Answer 1

Вот рабочий пример, где мы используем unshift:

angular.module('myApp.directives', []).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(attrs.format)(plainNumber)); 
       return plainNumber; 
      }); 
     } 
    }; 
}]); 

HTML, кажется:

<input type="text" ng-model="test" format="number" /> 

См Демо Fiddle

Надежда его помощь

Answer 2

Малый редактирования для ответа Максима Shoustin в ниже в соответствии с ответом на этот вопрос: AngularJS formatter - how to display blank instead of zero

Единственное изменение, чтобы обеспечить вход пустым, а не ноль на удаление последний номер:

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

http://jsfiddle.net/2n73j6rb/

Answer 3

Этот модуль отлично работает для меня.

https://github.com/assisrafael/angular-input-masks

Пример:

<input type="text" name="field" ng-model="number" ui-number-mask>