使用AngularJS将HTML文件中的数字限制在2位小数点以下

Question

我有一个HTML页面，它显示来自AngularJS控制器的信息。这是守则的一部分：

<td id="calories">{{ ctrl.caltotal }}</td>

我的问题是，我需要做什么才能把它显示在小数点后的2位呢？现在，如果我改变程序，它可以给出像23.00000004这样的值。这是应该在角控制器或HTMl视图中进行的更改吗？谢谢。

Answer 1

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

这将把它限制在小数点后两位。

Answer 2

更新

查看DecimalPipe ( https://angular.io/api/common/DecimalPipe )。

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

{minIntegerDigits}.{minFractionDigits}-{maxFractionDigits}表示'1.0-2'

minIntegerDigits:小数点之前的最小整数位数。缺省值为1。

minFractionDigits:小数点之后的最小位数。默认值为0。

maxFractionDigits:小数点之后的最大数字数。缺省值为3。

Answer 3

考虑以下代码：

<html>
<head>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.8/angular.min.js"></script> 
    <style>

    </style>
</head>
<body ng-app="myApp" ng-controller="myCtrl"> 
    <input type="number" ng-model="score" /> {{score | number:2}}
<script>
    //1 module declaration
    var app = angular.module('myApp', []);
    //2 controller declaration
    app.controller('myCtrl',function($scope){
        $scope.score = 50;
        //code here
    });
</script> 
</body> 
</html> 

详情见此处：

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

另请参阅：

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