角度模板的数学运算

Question

每当我在视图模板中尝试这样的事情时，它就会按预期工作。

{{20*30}}

但每当我尝试

{{somevalue1*somevalue2}}

somevalue1和somevalue2都来自组件，而somevalue2来自api并且它在一个阵列中，它显示NaN。

怎么处理？

是因为String值吗？

如何在模板中的数字转换？

Answer 1

Is it because of the String value?

是的。您无法轻松访问模板范围中的Windows范围，因此我将创建一个方法：

calculateStuff(){
  return Number(somevalue1) * Number(somevalue2);
}

在模板中：

{{calculateStuff()}}

如果字符串不以表示数字的字符开头，它仍将返回NaN。

Answer 2

somevalue1 somevalue2可能是字符串。但是，您需要共享更多代码才能获得真正的答案。

将{{somevalue1}}和{{somevalue2}}添加到模板中，这样您就可以确保模板正在接收您期望的值。

Answer 3

问题是根据某些区域设置格式化的字符串值（在您的情况下，它是US locale）

你可以：

• 将字符串转换为数据检索的值
• 创建角度变换管道
• 在模板中使用辅助函数/方法
• 如果你能够，在服务器端调整数据（这是一个很好的做法，发送原始数据并在需要时格式化它们）

有几种方法可以处理转换。如果这是您收到该数字的唯一格式。只需替换逗号Number('1,234.42'.replace(',', ''))或使用为此目的创建的一些库，如NumeralJS