AngularJS - 根据ng-repeat中的项目数显示/隐藏

时间:2014-08-21 12:27:40

标签: angularjs angularjs-ng-repeat ng-show angular-ng-if ng-hide

我有2个过滤器的ng-repeat:

<div class="container">
    <div ng-repeat-start="addresses in Address.Entries | filter:{IsRegistered: true} | filterDate:'InfoDetails'">
        {{ addresses.name }}
        {{ addresses.number }}
        {{ addresses.email }}
        {{ addresses.contact}}
    </div>
</div>

如何在with class =&#34; container&#34;中添加ng-show或ng-hide;如果在ng-repeat中重复的项目长度大于零,则仅显示此元素?

2 个答案:

答案 0 :(得分:4)

您需要将过滤结果分配给新变量,以便考虑已过滤列表的长度。

然后您可以使用新变量来显示/隐藏该部分。

Working Fiddle

<div class="container" ng-show="filtered.length > 0">
    <div ng-repeat-start="addresses 
         in filtered = (Address.Entries 
                          | filter:{IsRegistered: true} 
                          | filterDate:'InfoDetails')">
          {{ addresses.name }}
          {{ addresses.number }}
          {{ addresses.email }}
          {{ addresses.contact}}
     </div>
</div>

答案 1 :(得分:1)

尝试编写一个单独的函数,它将在控制器中发回true / false(将确定ng-show)。

如下所示,

<div class="container" ng-show="functionToDeterminetheState()">
   <div ng-repeat-start="addresses in Address.Entries | filter:{IsRegistered: true} | filterDate:'InfoDetails'">
{{ addresses.name }}
{{ addresses.number }}
{{ addresses.email }}
{{ addresses.contact}}