如何从 AngularJS ng-repeat 中排除项目

Question

是否可以排除 ng-repeat 中的项目？

例如，我有类似以下内容（经过简化以缩短内容）：

<div class="row" data-ng-repeat="entry in data.feed.entry | orderBy:'gsx$timestamp.$t':true">
{{entry.gsx$jobID.$t}}
</div>

我有另一个名为 exclusionData 的范围对象，它的结构类似。我想排除我的第一个 ng-repeat 中出现在 exclusionData.feed.entry.gsx$jobID.$t

中的任何项目

或者是否有更简单的方法可以在我的控制器中执行此操作（即立即排除数据）？数据和排除数据均来自两个不同的 JSON 提要。

Answer 1

最简单的方法是在重复中使用过滤器指令，但您也可以在控制器中执行此操作。

这取决于您的应用程序从 OO 设计的角度看如何。

Answer 2

您可以使用如下所示的过滤器，也可以只使用 ng-if/ng-show

<div class="row" data-ng-repeat="entry in data.feed.entry | orderBy:'gsx$timestamp.$t':true | filter: {gsx$exlucde.$t: true}">
{{entry.gsx$jobID.$t}}
</div>

data.feed.entry = [{
    gsx$jobID.$t: 'something',
    gsx$exlucde.$t: true,
    gsx$timestamp.$t: '1/1/1990'
}]

Answer 3

您可以像这样创建过滤器：

angular.module('appFilters', []).filter('yourFilterName', function() {
    return function(input, key) {          
      var myList = [];
      for(var i = 0; i < input.length; i++){
        var found = _.find($scope.exclusionData, function() { // You can replace this with your own function.
          // Your own logic here    
        });

        if(found){              
          myList.push(input[i]);
        }
      }
      return myList;
    };
  });

我假设您的项目中包含下划线，但您可以改为实现自己的搜索功能。

在您的模板中，您像这样传递过滤器：

<div class="row" data-ng-repeat="entry in data.feed.entry | yourFilterName | orderBy:'gsx$timestamp.$t':true">
  {{entry.gsx$jobID.$t}}
</div>

Answer 4

这将排除匹配数据，只需添加一个 ng-if，并添加一个 bang 使其为假。

<div 
    class="row"
    data-ng-repeat="(key, entry) in data.feed.entry | orderBy:'gsx$timestamp.$t':true"
    ng-if="!exclusionData.feed[key]gsx$jobID.$t">
    {{entry.gsx$jobID.$t}}
</div>

如何从 AngularJS ng-repeat 中排除项目

How do you exclude items from AngularJS ng-repeat

javascript

json

angularjs

angularjs-ng-repeat