Angular 2 - 如何摆脱角度绑定中的额外小数?

时间:2017-08-19 14:58:55

标签: javascript angular decimal two-way-binding

我在我的视图中有这样的声明,并且绑定有值让我们说6970.87127381382131831但是,我想将它限制在最多2位小数。由于我使用ngFor列出元素,因此无法使用.toFixed(2)来限制对象。谢谢你们 !



{{ cartitem.original_price * cartitem.qty * cartitem.unit_multiplier }}




我尝试过以下方法:



 {{ cartitem.original_price * cartitem.qty * cartitem.unit_multiplier | number : 2 }}




没帮我。

2 个答案:

答案 0 :(得分:4)

以下表达式允许您将小数部分设置为两位数:

{{ cartitem.original_price * cartitem.qty * cartitem.unit_multiplier | number : '1.0-2' }}

1.2-2表示:小数点前至少一位数,小数点后至少2位但不超过2位数。

{{1}}

1.0-2表示:小数点前至少一位数,后面不超过2位数。

关于Angular DecimalPipes和配置:https://angular.io/api/common/DecimalPipe

答案 1 :(得分:1)

正如官方文档https://docs.angularjs.org/api/ng/filter/number

中所报告的那样
{{ number_expression | number : fractionSize}}

在你的情况下:

 {{ (cartitem.original_price * cartitem.qty * cartitem.unit_multiplier) | number : 2 }}

如果您想要固定位数,可以创建自己的过滤器

App.filter('twoDecimal',function(input, scope){

return function(){

   return input.toFixed(2);

  }
})

并应用它

 {{ (cartitem.original_price * cartitem.qty * cartitem.unit_multiplier) | twoDecimal }}