Question

我想在过滤器（ng-repeat）上没有返回任何项目时显示一个div（消息）。

根据选择框（ng-model）进行过滤。并且某些选项没有结果，那时用户应该能够在同一个地方阅读消息。我可以在这里使用ng-show / hide吗？怎么样？

谢谢，

Answer 1

您还可以将过滤后的数组保存在变量中，然后在ng-show表达式中使用该变量：

<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>

您可以在此plunker中看到它的实际效果。

Answer 2

您可以使用类似

之类的内容来获取过滤器返回的数组大小

{{(data|filter:query).length}}

您可以将此表达式用于ng-show表达式。我不确定它会有多高效。

Answer 3

使用ngRepeat的标准语法有一个更简单的解决方案。

正如official documentation中所述，即使对其应用了过滤器，ngRepeat也会接受该集合的别名：

rm -r .tmp/

注意：我为从文档中复制的示例添加了广告附加过滤器，以获得更完整的示例。

在此示例中，您只需使用：

<div ng-repeat="model in collection | filter:search | orderBy: 'id' as filtered_result track by model.id">
    {{model.name}}
</div>

我用AngularJS 1.5.0进行了测试，我不知道这个功能何时推出。

过滤器在ng-repeat中返回任何内容时如何显示消息 - AngularJS

3 个答案: