角度过滤器，嵌套 ng-repeat

Posted 2023-03-10

【中文标题】角度过滤器，嵌套 ng-repeat

【英文标题】：angular filter, nested ng-repeat

【发布时间】：2015-09-15 17:36:06

【问题描述】：

我在进行角度嵌套过滤时遇到问题，其中两个过滤器相互依赖。

我想做这样的事情：

<div ng-repeat="g in groups | filter:groupFilter">
  ...
  <tr ng-repeat="c in g.components | filter:componentFilter">
    ...
  </tr>
  ...
</div>

但我的问题是以下两个限制：

如果第一个过滤器匹配，即组过滤器，则组件过滤器不应应用于该组中的组件。 如果没有找到与特定组的搜索词匹配的组件，则不应匹配该组。

关于如何做这样的事情有什么好主意吗？我尝试了许多不同的解决方案并搜索了解决方案，但找不到与此接近的解决方案。

---

编辑：

组看起来像：

[
  
    "group_id": 1,
    "order_id": 180,
    "title": "Title1",
    "priority": 1
  ,

  
    "group_id": 2,
    "order_id": 180,
    "title": "Title2",
    "priority": 2
  
]

和组件：

"components": [
    
      "component_id": 1,
      "order_id": 180,
      "group_id": 1,
      ...,
      "materials": [
        ...
    ]  ... ]

还有过滤器：

<tr ng-repeat="c in g.components | componentFilter: searchTerm:group">


.filter('componentFilter',function()
       return function(components, searchTerm, group)
         var term = searchTerm.toLowerCase();
         var filtered = [];
         angular.forEach(components, function(c)
           if((c.description.toLowerCase().indexOf(term) != -1) ||
              c.type.toLowerCase().indexOf(term) != -1 ||
              group.title.toLowerCase().indexOf(term) != -1)
             filtered.push(c);
           
         );
         return filtered;
         )

所以现在，使用关于解析参数的建议，它会按应有的方式过滤，但删除组除外，当它没有组件时

【问题讨论】：

您可以将参数传递给过滤器。在这里查看：[***.com/questions/11753321/… [1]：***.com/questions/11753321/…

您需要自定义过滤器。请分享示例数据以及 groupFilter 和 componentFilter 定义

【参考方案1】：

您可以将过滤后的结果放入一个新变量中。

 <div ng-repeat="g in filteredGroup = (groups | filter:   groupFilter)">' 

然后将布尔参数传递给您的第二个过滤器以确定它是否应该过滤。 (filteredGroup.length == groups.length)

您可以使用相同的策略来确定组是否与第二个过滤器匹配。