Format input value in Angularjs

by

Here is working example where we use 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;
            });
        }
    };
}]);

The HTML seems:

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

See Demo Fiddle

Hope its help

More Related Contents:

  1. How do you increment a cookie value?
  2. Java script on focus instead of onclick
  3. “Thinking in AngularJS” if I have a jQuery background? [closed]
  4. ng-repeat finish event
  5. AngularJS – Any way for $http.post to send request parameters instead of JSON?
  6. What is the $$hashKey added to my JSON.stringify result
  7. How do you get the cursor position in a textarea?
  8. How to trigger ngClick programmatically
  9. AngularJS: How to run additional code after AngularJS has rendered a template?
  10. How to get the containing form of an input?
  11. How can I make an AngularJS directive to stopPropagation?
  12. How do I use jQuery’s form.serialize but exclude empty fields
  13. AngularJS group check box validation
  14. What is the elegant way to get the latest date from array of objects in client side?
  15. Phone mask with jQuery and Masked Input Plugin
  16. Can’t get value of input type=”file”?
  17. Disable Chrome strict MIME type checking
  18. how to bind Bootstrap-datepicker element with angularjs ng-model?
  19. Skip ng-repeat JSON ordering in Angular JS
  20. Consider marking event handler as ‘passive’ to make the page more responsive
  21. ScrollTo function in AngularJS
  22. AngularJS : ng-model binding not updating when changed with jQuery
  23. Remove ‘All Files’ option from HTML file input
  24. Hour difference between two times(HH:MM:SS a)in momentjs
  25. html() vs innerHTML jquery/javascript & XSS attacks
  26. Run jQuery code after AngularJS completes rendering HTML
  27. Call angularjs function using jquery/javascript
  28. AngularJS: lazy loading controllers and content
  29. Javascript Input Text Masking without Plugin
  30. How to force input to only allow Alpha Letters?

Leave a Comment