如果嵌套的 ng-repeat 不为空，我如何只显示一个元素? [英] How do I only show an element if nested ng-repeat is not empty?

问题描述

我有一个列表列表，使用嵌套的 ng-repeat 创建.每个外部 ng-repeat 包含一个带有内部列表标签的 div(例如:Group A").我现在正在尝试创建一种方法来避免在内部列表由于过滤而为空时显示此标签(由输入搜索文本应用)

I have a List of lists, created with a nested ng-repeat. Each outer ng-repeat contains a div with the label of its inner list (eg: "Group A"). I'm now trying to create a way to avoid showing this label if the inner list is empty due to filtering(Applied by an input searchtext)

这是一个解释我的问题和我尝试的解决方案的 plunker:Plnkr

Here is a plunker explaining my issue and my attempted solution : Plnkr

拥有像 isGroupEmpty 这样的重"功能似乎非常麻烦 - 有没有办法以更简单的方式做到这一点?我正在考虑将标签移动到内部 ng-repeat 并拥有 ng-show="$first" 但它看起来不太好

Having a 'heavy' function like isGroupEmpty seems extremely cumbersome - Is there any way to do this in a much simpler fashion? I was toying with the idea of moving the label inside the inner ng-repeat and having ng-show="$first" but it doesnt look great

推荐答案

我最终得到了以下完美的解决方案.Plnkr

I ended up with the following solution which worked perfectly. Plnkr

通过在内部 ng-repeat 中设置一个变量，我能够根据这个变量的长度来评估 ng-show，如下所示:

By setting a variable in the inner ng-repeat I was able to evaluate ng-show based on this variables length like so :

<input ng-model='searchText'/>
<span ng-show='filtered.length > 0'>
  <ul>
    <li ng-repeat='el in filtered = (model | filter:searchText)'>
      <div>{{el.label}}</div>
    </li>
  </ul>
</span>

这篇关于如果嵌套的 ng-repeat 不为空，我如何只显示一个元素?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！