使用ng-repeat和limitTo限制显示的可见项目数

一尘不染

angularjs

我正在尝试将结果集限制为固定数量。我可以limitTo与一起使用ng- repeat，但这会限制项目，无论它们当前的可见性如何，并从DOM中删除项目。我想限制所有可见项目，同时将所有内容保留在DOM中。

这是我当前的代码。我的目标是即使列表中items包含500个项目，也始终不超过50 个项目。

<div ng-repeat="item in items | limitTo: 50">
  <div ng-show="item.visible">
    <p>item.id</p>
  </div>
</div>

最初将限制为50个项目，但是如果我过滤列表（通过修改某些项目上的item.visible），该列表将永远不会显示50-500范围内的项目，而是显示少于50个项目。限制an的正确方法是什么ng- repeat，以使其仅将可见项目计入限制？

阅读 271

2020-07-04

共1个答案

一尘不染

您可以使用：

<div ng-repeat="item in items | filter:{visible: true} | limitTo: 50">
    <p>{{item.id}}</p>
</div>

filter:{visible: true} 将返回所有可见项目的列表

您可以查看angularjs文档，以获取有关过滤器过滤器的更多信息。
http://docs.angularjs.org/api/ng.filter:filter

2020-07-04