Skip to content Skip to sidebar Skip to footer

Restricting Number To 2 Decimal Places In Html File With Angularjs

I have a HTML page that displays the information from an AngularJS controller. This is part of the code: {{ ctrl.caltotal }} My question is, wha

Solution 1:

<td id="calories">{{ ctrl.caltotal | number:2}}</td>

That will restrict it to two decimal places.

Solution 2:

UPDATE

Check out DecimalPipe ( https://angular.io/api/common/DecimalPipe ).

{{ your_number | number : '1.0-2' }}

'1.0-2' represents {minIntegerDigits}.{minFractionDigits}-{maxFractionDigits}

minIntegerDigits: The minimum number of integer digits before the decimal point. Default is 1.

minFractionDigits: The minimum number of digits after the decimal point. Default is 0.

maxFractionDigits: The maximum number of digits after the decimal point. Default is 3.

Solution 3:

Consider the following code :

<html><head><scriptsrc="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.8/angular.min.js"></script><style></style></head><bodyng-app="myApp"ng-controller="myCtrl"><inputtype="number"ng-model="score" /> {{score | number:2}}
<script>//1 module declarationvar app = angular.module('myApp', []);
    //2 controller declaration
    app.controller('myCtrl',function($scope){
        $scope.score = 50;
        //code here
    });
</script></body></html>

See here for further information:

https://docs.angularjs.org/api/ng/filter/number

Also see:

Angular how to display number always with 2 decimal places in <input>AngularJS {{ val | number:1 }} not rounding to 1 decimal place

Post a Comment for "Restricting Number To 2 Decimal Places In Html File With Angularjs"