AngularJS - 当 ng-repeat 和过滤器不返回任何行时如何显示计数 0答案

【问题标题】：AngularJS - how to show count 0 when ng-repeat and filter returns no rowsAngularJS - 当 ng-repeat 和过滤器不返回任何行时如何显示计数 0
【发布时间】：2014-06-18 23:11:03
【问题描述】：

我正在尝试打印通过 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 的回复实际上解决了我的问题，但我不知道如何解决。我想知道是否有一个非常简单的方法来做到这一点。

【问题讨论】：

标签： javascript angularjs

【解决方案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 对象上可用。因此，它可以在该控制器范围内的其他地方使用。这就是为什么可以检查它的长度以查看是否没有颜色的原因。

【讨论】：

哇，真快！谢谢回复。我自己能够理解这么多。我希望了解该语句是如何被解释的，为什么会为该范围创建全局变量，而不是当我尝试使用不起作用的 ng-model 时。 我的问题是关于一种更简单的方法来完成我想做的事情，如果有的话。 现在，这就是
{{i.vals.length}}
{{i2.length==0?'0':''}} 更新插件链接plnkr.co/edit/KNVwf2Yckxf1Qcyzcmea?p=preview

【解决方案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>

【讨论】：