Angular过滤器实现最大整数求和功能报错求助

你在修改Angular过滤器时踩了几个典型的坑，我来帮你梳理问题并给出符合需求的正确实现。

先拆解你遇到的错误原因 #

当前代码抛出“is not iterable”错误，主要是这几个问题导致的：

• 硬编码属性名：你直接写了data.DeploymentTime，但过滤器的参数是key，这不仅让过滤器失去复用性，还会因为data可能没有DeploymentTime属性，导致遍历一个非迭代对象。
• 数组处理逻辑错误：[].slice.call(i)的用法不恰当，如果child是数组，不需要这种转换；如果是单个数值，这种转换会生成不符合预期的类数组，引发后续问题。
• 初始化逻辑错误：var max = array把整个数组赋值给了max，后续数值和数组的比较永远不成立，完全偏离了你要实现的最大值累加逻辑。
• 语法结构混乱：代码的括号不匹配，return total的位置也不对，导致代码执行逻辑混乱。

正确的过滤器实现 #

根据你的需求（提取指定key的数值，计算所有最大值的累加和，比如[5,5,7,7,8,8]返回16），我重新编写了逻辑清晰的过滤器：

.filter('sumMaxByKey', function() {
  return function(data, key) {
    // 边界情况处理：如果传入的不是数组或key未定义，直接返回0
    if (!Array.isArray(data) || typeof key === 'undefined') {
      return 0;
    }

    // 提取所有有效的整数，过滤掉非数字的无效项
    const values = data
      .map(item => parseInt(item[key], 10))
      .filter(num => !isNaN(num));

    // 如果没有有效数值，返回0
    if (values.length === 0) {
      return 0;
    }

    // 快速找到数组中的最大值
    const maxValue = Math.max(...values);

    // 累加所有等于最大值的元素
    return values.reduce((total, num) => {
      return num === maxValue ? total + num : total;
    }, 0);
  };
})

代码逻辑说明 #

1. 边界校验：先判断传入的data是否为数组、key是否存在，避免无效输入引发的报错。
2. 数值提取与清洗：用map提取指定key的数值并转为整数，再用filter过滤掉非数字的无效项，确保后续计算的准确性。
3. 最大值计算：用Math.max(...values)快速获取数组最大值（扩展运算符...把数组转为参数列表，适配Math.max的参数要求）。
4. 最大值累加：用reduce遍历数组，只累加等于最大值的元素，得到最终结果。

使用示例 #

假设你的数据结构如下：

$scope.data = [
  {score: 5},
  {score: 5},
  {score: 7},
  {score: 7},
  {score: 8},
  {score: 8}
];

在模板中调用过滤器：

<p>最大值累加结果：{{ data | sumMaxByKey:'score' }}</p>

会输出16，完全符合你的需求。

内容的提问来源于stack exchange，提问作者WhoAmI