使用过滤器的ng-repeat中的复制

我正在尝试输出具有特定血型的对象。我正在使用过滤器。使用过滤器的ng-repeat中的复制

我在这个重复错误。我使用了chrome调试器，发现它执行多次。数据在每次迭代中传递给过滤器，并且过滤器每次都从头开始完成其全部工作。

这是我的筛选方法

Filters.filter('bloodFilter', function() { 
    var i, filtered = []; 
    return function(data, bloodGroup) { 
    if (!data) { 
     data = GitHub.USERS; 
    } 
    if (!bloodGroup) { 
     bloodGroup = 'O+' 
    } 
    for (i = 0; i < data.length; i += 1) { 
     var value = data[i]; 

     if (value.blood === bloodGroup) { 
     filtered.push(value); 
     } 
    } 
    return filtered; 
    } 
});

这是我的数据

GitHub.USERS = [ 
    { 
    fname: "Usman", 
    lname: "Tahir", 
    blood: "O+" 
    }, 
    { 
    fname: "Ali", 
    lname: "Hassan", 
    blood: "B+" 
    }, 
    { 
    fname: "Aqib", 
    lname: "Javed", 
    blood: "AB+" 
    } 

];

这是我的控制器

Controllers.controller('BodyController', function($scope) { 
    $scope.users = GitHub.USERS; 
});

，这是我的索引代码

<body ng-controller="BodyController">  
    <ul> 
     <li ng-repeat="item in users | bloodFilter"> 
     <b>{{item.fname}}</b> {{item.lname}} {{item.blood }} 
     </li> 
    </ul> 
    </body>

来源

2015-04-23 Usman Tahir

它是重复*错误*还是只是它运行多次？ –

其中'bloodGroup' – scniro

过滤器定义在顶部。我想我发现了问题。让我回答我自己的问题：D –

问题与JavaScript闭包有关。我定义了数组返回创建问题的外部返回块。

我的过滤功能应该是这样的，i和filtered应该在返回块内。

Filters.filter('bloodFilter', function() { 
    return function(data, bloodGroup) { 
    var i, filtered = []; 
    if (!data) { 
     data = GitHub.USERS; 
    } 
    if (!bloodGroup) { 
     bloodGroup = 'O+' 
    } 
    for (i = 0; i < data.length; i += 1) { 
     var value = data[i]; 

     if (value.blood === bloodGroup) { 
     filtered.push(value); 
     } 
    } 
    return filtered; 
    } 
});

来源

2015-04-23 12:16:42

使用过滤器的ng-repeat中的复制

回答

相关问题