AngularJS中ng-repeat结合数组过滤失效问题求助

云上老周

2026-8-22

AngularJS ng-repeat 筛选匹配ref_id的项

你的错误原因分析

内置Filter失效：你写的{ ref_id: data1.id }完全无效，因为data1是数组，根本没有id属性，这个条件等价于{ ref_id: undefined }，Angular的filter会忽略未定义的筛选条件，所以直接输出了所有项。
自定义函数问题：
- angular.forEach不会返回匹配结果，它的返回值始终是原数组，所以你的函数不管有没有匹配都会返回true（数组是真值），等于没筛选。
- 调用filter时写Test()会立即执行函数，此时没有传入item参数，导致item.ref_id报未定义错误，正确写法是直接传函数名Test，让Angular遍历data2时自动把每个项传进去。
- 函数语法有错误，缺了闭合的括号和大括号。

正确解法

解法1：用Array.some()实现筛选函数

直接用数组的some方法判断当前项的ref_id是否存在于data1的id列表中，代码简洁且逻辑清晰：

<div ng-repeat="result in data2 | filter: matchRefId"> {{ result.Result }} </div>

$scope.matchRefId = function(item) {
  // 遍历data1，只要找到匹配的id就返回true
  return $scope.data1.some(function(user) {
    return user.id === item.ref_id;
  });
};

解法2：预处理id集合（性能优化）

如果data1的数据量比较大，每次筛选都遍历整个数组会浪费性能，建议先把data1的id存到一个Set集合里，判断匹配的时间复杂度降到O(1)：

// 提前把data1的id存入Set
$scope.validRefIds = new Set($scope.data1.map(user => user.id));

$scope.matchRefId = function(item) {
  // 直接判断ref_id是否在有效集合中
  return $scope.validRefIds.has(item.ref_id);
};

HTML部分和解法1完全一致。