How to format number in input in AngularJS

Question

I am using angularjs and I have an input like

<input type='text' pattern="[0-9.,]+" ng-model="treasuryValue"  />

I set first value to input using ng-model tag. But while setting first value to input my pattern doesn't work. Pattern tag runs first time when input changes. How can I format value in input while setting it's first value.

Shaunak D · Accepted Answer · 2015-05-13 12:43:03Z

4

Use ng-pattern attribute,

<input type='text' ng-pattern="/[0-9.,]+/" ng-model="treasuryValue" />

To format the value initially,

function formCtrl($scope,$filter){
    $scope.treasuryValue = '33,345';
    $scope.$watch('treasuryValue', function() {
        $scope.name = $filter('number')($scope.name);
  });
}

Demo

edited May 13, 2015 at 12:43

answered May 13, 2015 at 11:01

Shaunak D

20.7k10 gold badges48 silver badges79 bronze badges

Sign up to request clarification or add additional context in comments.

9 Comments

neverwinter Over a year ago

nothing changed. there is no difference between ng-pattern and pattern tags in this case.

Shaunak D Over a year ago

Works for me here jsfiddle.net/KGd8K/1049. Im setting a string value which does not work, but if you change it to int/float it will work jsfiddle.net/KGd8K/1050.

neverwinter Over a year ago

Doesn't work. I entered 324234. I expect 324,234. But it returns 324234

Shaunak D Over a year ago

The pattern won't do this for you initially. You need to you use filters for that.

Shaunak D Over a year ago

You need to add filter in controller. Check this jsfiddle.net/KGd8K/1051

|

Collectives™ on Stack Overflow

How to format number in input in AngularJS

1 Answer 1

9 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

9 Comments

Your Answer

Sign up or log in

Post as a guest

Related