Question

当我使用过滤器时，如何隐藏没有列表项的item-divider？这是代码：

<div ng-repeat="elem in codeList | orderBy:predicate:reverse">
    <div class="item item-divider">
        {{elem.data}}
    </div>
    <ul class="list">
        <li class="item item-icon-right" ng-repeat="item in elem.array | filter:search" ng-click="action(item)">
            <h2>{{item.text}}</h2>
            <i class="icon ion-{{item.icon}}"></i>
        </li>
    </ul>
</div>

我想知道怎么用＆＃34; Angular方式＆＃34;。

Answer 1

您需要使用as filteredItems（使用Angular 1.3）对已过滤的列表进行别名，并使用filteredItems.length有条件地显示/隐藏您的item-divider。

<div ng-show="filteredItems.length" class="item item-divider">
    {{elem.data}}
</div>
<ul class="list">
    <li class="item item-icon-right" 
        ng-repeat="item in elem.array | filter:search as filteredItems" 
        ng-click="action(item)">
        <h2>{{item.text}}</h2>
        <i class="icon ion-{{item.icon}}"></i>
    </li>
</ul>

Answer 2

我会选择ng-hide

 <div class="item item-divider" ng-hide="elem.array.length == 0">
    {{elem.data}}
</div>

AngularJs如何隐藏没有项目的item-divider

2 个答案: