Question

我正在尝试打印通过AngularJS中的条件过滤的元素数。我正在使用ng-repeat循环收集并过滤它以获取计数，并且当它有值时它可以正常工作。但是，当过滤器返回空结果时，Angular不会渲染元素，因此，我无法显示0计数。 http://plnkr.co/edit/KNVwf2Yckxf1Qcyzcmea?p=preview

<div ng-repeat="i in iArr|filter:i.name='tim'">{{i.vals.length}}</div>

有没有人能够以简单的方式使用它。

编辑：问题How to show a message when filter returns nothing in ng-repeat - AngularJS有一个回复，实际上解决了我的问题，但我不知道如何。我想知道是否有一种非常简单的方法可以做到。

Answer 1

从那个答案：

<select ng-model="shade" ng-options="shade for shade in shades"></select><br>
<ul>
    <li ng-repeat="c in filteredColors = (colors | filter:shade)">{{c.name}}</li>
</ul>
<div ng-show="!filteredColors.length">No colors available</div>

密钥位于c in filteredColors = (colors | filter:shade)。过滤器表达式colors | filter:shade的数组结果被设置为filteredColors，然后在$scope对象上可用。因此，它可以在该控制器范围的其他地方使用。这就是为什么可以检查它的长度以查看是否没有颜色。

Answer 2

这是一个有解决方案的工作plnkr和一些额外的

http://plnkr.co/edit/eOmHhR1VWjfYzHYqiEY1?p=preview

<body ng-controller="MainCtrl">
  <label><input type="text" ng-model="search.vals">vals</label>
  <label><input type="text" ng-model="search.name">name</label>
  <div ng-repeat="i in filteredArr = (iArr | filter:search)">{{i.vals}} | {{i.name}}</div>
  <div ng-if="!filteredArr.length">0</div>
</body>

AngularJS - 当ng-repeat和filter返回没有行时如何显示计数0

2 个答案: