AngularJS – 如果child循环为空(过滤),则隐藏父元素

前端之家收集整理的这篇文章主要介绍了AngularJS – 如果child循环为空(过滤),则隐藏父元素前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我有一个案例,其中我有一个嵌套循环,其中一个由一个过滤器函数构造的,该过滤器函数以父作为参数.我还有另一个过滤器,只是做一个文本比较.这是例子
<div ng-repeat="group in groups">
  {{group.name}}
  <div ng-repeat="material in materials | filter:filterByGroup(group) | filter:search ">
    {{material.name}}
  </div>
</div>

现在,我的问题是,当过滤器:搜索被应用并且过滤掉特定组中的所有结果时,我想隐藏组(而不是留下没有子元素的空的group.name).

我没有自己的组中的资料,所以我没有父母的重复范围内的信息.问题是如果有办法可以访问嵌套的ng重复,并从父代查看其计数,并隐藏父项,如果该计数为0.

UPDATE

这是一个更好地解释情况的小提琴:fiddle

主要的问题是我不想将我的资料与团体联系起来.我可以做到这一点,如果没有其他的工作,但它听起来像一个重载(因为我将需要基本上过滤结果两次),如果我可以通过检查嵌套循环.

谢谢

HERE提出了一个更清洁的解决方案.

您需要做的是根据在数据结构上应用过滤器的表达式将ng-show / ng-if包装在相关区域中,并提取长度.以下是您的示例中的工作原理:

<div ng-show="(materials | filter:filterByGroup(group)).length">
    <div ng-repeat="group in groups">
      {{group.name}}
      <div ng-repeat="material in materials | filter:filterByGroup(group) | filter:search ">
        {{material.name}}
      </div>
    </div>
  </div>

这使您可以隐藏复杂的结构,一旦它们为空,由于过滤,例如一张结果表.

原文链接:https://www.f2er.com/angularjs/142927.html

猜你在找的Angularjs相关文章