如何始终显示两位小数的数字 - Angularjs

Question

I want to display digit always with two decimal values. I can display values with two decimal values.

$scope.value1 = 10000;
$scope.value2 = 12444.44443;

In controller I used

$scope.value1 = $scope.value1.toFixed(2);
$scope.value2 = $scope.value2.toFixed(2);

Then in HTML, I can display as " 10000.00 " " 12444.44 ". But its changing my model value also. I don't want to change the value. I want to display value only as " 1000.00 " " 12444.44 ".

Even I tried as

{{value1 | setDecimal : 2 }}
{{value2 | setDecimal : 2 }}

It displays as

10000
12444.44

This setDecimal changes only my decimal value.

I want to display like setDecimal but need to display 10000 also as 10000.00.

Answer 1

You can use the number filter as a pipe in your template to achieve this:

 angular.module('app', []).controller('MyCtrl', ['$scope', function($scope) { $scope.value1 = 10000; $scope.value2 = 12444.44443; }]);

 <div ng-app="app"> <div ng-controller="MyCtrl"> <p>{{ value1 | number: 2 }}</p> <p>{{ value2 | number: 2 }}</p> </div> </div> <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script>

Answer 2

Please see the code output. And I think this Documents is really helpful

 <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.6/angular.min.js"></script> <div ng-app> {{12342 | number: 2}}</div>

Answer 3

value.toFixed(2)

应该给你需要的

Answer 4

use toFixed(2) method for fixing it to two

Demo

parseFloat(Math.round(num3 * 100) / 100).toFixed(2);