Question

我（和其他许多人一样）遇到了无限$ digest循环的问题。在阅读了许多SO Q＆amp; As并在AngularJS文档中花费了大量时间后，我仍然不确定如何使用最佳实践构建此组件。

问题的根源似乎是嵌套过滤器造成的。但是，我故意以一种我认为正确的方式分解功能的责任。

这是一个pnkr： http://plnkr.co/edit/RnPcMOTzRfTv5ye1ixJ3?p=preview

正如您所见，有一个分页指令接受在其范围之外过滤的items数组。

<app-pager items="items | filter:filter.value" items-per-page="5">

在custom指令中，处理所有分页功能：

<div class="pager">
  <div ng-transclude ng-repeat="item in items | limitTo:itemsPerPage:(page * itemsPerPage)"></div>
  <uib-pagination total-items="items.length" items-per-page="itemsPerPage" ng-model="page"></uib-pagination>
</div>

这在技术上有效，但由于变异数组，它会抛出10 $ digest（）迭代到达错误。哦，抱歉变量的命名，＆＃34; items＆＃34;被重用;它只是一个简单的例子，并且没有冲突，因为寻呼机指令创建了一个独立的范围。

我不希望过滤器成为分页的一部分，我不想在我的应用的多个区域重复页面功能。

根据最佳实践重组此方法的最佳方法是什么？

更新：看起来AngularJS@1.3.15并不支持limitTo的第二个参数，但这并不能改变问题的根源。

Answer 1

好的，关于items元素上的属性<app-paper>。您似乎不应在数据绑定表达式中使用filter，因为它会导致无限$digest循环，因为它会在每次items过滤时强制执行。

您可以做的是将过滤器value与未过滤 items一起传递给指令。然后在指令中创建并使用自定义过滤器。

以下是我的plunker example（我更改了html个文件和js个文件中的代码。请注意我如何过滤页面长度（顺便说一句，你在过滤页面偏移的逻辑上有一点错误）。

但是！如你所说：

AngularJS@1.3.15不支持limitTo的第二个参数

所以，我想，您应该创建自己的过滤器以使其正常工作。以下是我对AngularJS@1.5.8

的工作原理another plunker example

角嵌套滤波器＆amp;无限$摘要循环

1 个答案: