无法插入将 $scope 变量传递给 angular 过滤器的错误

Can't interpolate error passing $scope variable in to a angular filter

我有一个 angular 过滤器,它通过检查数组中是否存在 id 和 returns 对应的图像 url 将用户 ID 转换为用户图像 url ], 数组随过滤器传递.

过滤器正在工作,ng-repeat 列表向我显示了正确的图像 url,但我的控制台中有 2 个错误。 第一个错误在第 4 行,第二个错误在 ionic.bundle.js:13380:32

错误:

Error: undefined is not an object (evaluating 'members.length')
Error: [$interpolate:interr] Can't interpolate: {{ participant.athlete_id | idToImage : clubMembers }} TypeError: undefined is not an object (evaluating 'members.length')


HTML:

<div ng-repeat="participant in participants | filter:{ event_id: event.id }: true track by $index">
    <img ng-src="{{ participant.athlete_id | idToImage : clubMembers }}">
</div>

Angular 过滤器:

1 app.filter('idToImage', function () {
2   return function (id, members) {
3       var curMember = id;
4        var len = members.length - 1;
5        while(len >= 0){
6           if(curMember >= members[len].id){
7               return members[len].profile;
8           }
9           len--;
10        }
11     };
12 });

俱乐部成员在 {{ participant.athlete_id | idToImage : clubMembers }} 是一个类似于下面示例的数组,并且是从外部源检索的:

$scope. clubMembers = [
   {"id":1234,"profile":"https://domain.net/pictures/1.jpg"},
   {"id":12345,"profile":"https://domain.net/pictures/3.jpg"},
   {"id":12346,"profile":"https://domain.net/pictures/4.jpg"}
]

我认为当 members 为空时您的过滤器不会处理该条件,因为当您不处理它时 members.length 将被搞乱并且代码执行将在该点停止。

过滤器

app.filter('idToImage', function () {
   return function (id, members) {
       if(!members) return; //return nothing in this case
       var curMember = id;
        var len = members.length - 1; //checking above if before processing members
        while(len >= 0){
           if(curMember >= members[len].id){
               return members[len].profile;
           }
           len--;
        }
    }
});