Adding Two decimal numbers with AngularJS

Question

I need to update an input such that if is an integer, you add 2 zeros.

Input: 12 Output: 12.00 (In the same input-text)

<body ng-app="">
    <script>
    function Controller($scope) {
      $scope.change = function() {

      };
    }
  </script>
  <div ng-controller="Controller">
    <input type="text" ng-model="value" ng-change="change()" />
    {{value | number:2}}
  </div>
</body>

It could be done within $scope.change, but it would take more lines of code. Is there a more direct way to implement it? such as {{value | number 2}}.

Thanks in advance.

Michael Tang · Accepted Answer · 2014-03-19 20:18:27Z

2

I think you've got it. Angular provides a default filter number. It works as:

{{val | number:<fractionsize>}}

If this number will represent currency, consider using the currency filter.

Edit: Using a filter also probably is a good idea for maintainability of your code, as it separates getting the data from formatting it.

edited Mar 19, 2014 at 20:18

answered Mar 19, 2014 at 20:09

Michael Tang

4,9265 gold badges27 silver badges24 bronze badges

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

2 Comments

JohnPortella Over a year ago

Hi, what I need is to automatically update the same input, but with the decimal point in the case that is an integer.

Michael Tang Over a year ago

You could try binding an event to apply the number filter every time the input changes; you can use this plunker as a starting point. However, you may notice in the example, there is some weird behavior with adding digits. Your best bet might to be writing a custom directive that handles input exactly how you're imagining.

Collectives™ on Stack Overflow

Adding Two decimal numbers with AngularJS

1 Answer 1

2 Comments

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Related