角求和与归约函数

时间:2019-02-04 20:50:47

标签: javascript html angular typescript

here开始,我试图通过在角度绑定中使用javascript reduce函数来求和对象数组的特定属性。

组件

totals: total[] = [{itemCount:1},{itemCount:2},{itemCount:3}, {itemCount:4}];

HTML

<div>{{ totals.map(t => t.itemCount).reduce((a, b) => a + b, 0) }}</div>

使用上述方法,我收到错误消息:“绑定不能包含分配”

stackblitz mockup

预先感谢

编辑

我已将@quirimmo提供的答案标记为正确,但我也想解决@jo_va的答案。

我觉得在组件内部提供一个有角度的方法是正确的方法@quirimmo,但是,在我的情况下,该组件是根据客户端请求进行JIT编译的,目前,我仍然不确定如何动态添加该方法在该组件构造过程中。这使我进入HTML内部的Expression方法,并有意识地避免了@jo_va的最佳实践答案。

我的解决方案是将服务作为对象传递给组件,并将方法放在该服务中以供参考。

感谢S.O的帮助。

4 个答案:

答案 0 :(得分:3)

在组件内部定义一个返回减小的值的函数,并在该组件的绑定调用内部定义一个函数:

['34.30125,-118.45398', '34.22328,-118.48269']

答案 1 :(得分:1)

您的reduce函数运行良好。但是,在角度绑定中使用表达式是一种不好的做法。

将逻辑移至组件并调用方法或getter。

答案 2 :(得分:0)

映射并减少返回一个新数组。这是您的错误出处。

您可以使用类似https://stackblitz.com/edit/angular-whrfxp的吸气剂。模板不应包含计算。

答案 3 :(得分:0)

totals.reduce((a,b)=> a + =(b。itemCount),0)有效