1

我有一个要分页的嵌套过滤列表。因为过滤了项目总数,所以我试图设置 html 上的页面总数,如下所示:

<div ng-repeat="group in filtered = (groups)|startFrom:(currentPage-1)*pageSize|limitTo:pageSize">

    <h2>
        {{ group.label }}
    </h2>

    <ul>
        <!-- BEGIN: Inner ngRepeat. -->
        <li ng-repeat="friend in group.friends">

            {{ friend.name }}
             <button class="btn btn-small" type="button" ng-click="deleteItem(friend)">Delete</button>
        </li>
        <!-- END: Inner ngRepeat. -->
    </ul>

</div>
<!-- END: Outer ngRepeat. -->

<pagination rotate="true" num-pages="Math.ceil(filtered.length/pageSize)" current-page="currentPage" max-size="maxSize" boundary-links="true">

</pagination>

小提琴: http ://plnkr.co/edit/SjQFkNvSVPUWolQv0KZY?p=preview

在指令属性上,我尝试使用表达式设置总页数,但出现不可分配模型表达式的错误...

[编辑]

为了更清楚,问题出在这一行:

<pagination rotate="true" num-pages="Math.ceil(filtered.length/pageSize)" current-page="currentPage" max-size="maxSize" boundary-links="true">

</pagination>

尝试评估表达式时:Math.ceil(filtered.length/pageSize)

[编辑]

正如 Pinocchio 建议的那样,我创建了一个 $scope.Math,然后可以从 Angular 访问 Math 函数,但是在 plunkr 中我得到了这个错误:Non-assignable model expression: Math.ceil(groups.length/pageSize) (directive: pagination) 但是在我的本地机器上,我没有在控制台中显示此错误。

我应该避免这种方法吗?

4

2 回答 2

1

If you stumbled upon this answer like I did, looking for the solution to the title of this question, I found it here: How to display length of filtered ng-repeat data

The issue with this example for me was in theory OP could just use groups.length in his pagination, for my use-case I'm doing something like this:

ng-repeat="student in filtered = (activeStudents | filter:groupFilter | filter:query) | startFrom: (currentPage - 1) * itemsPerPage | limitTo:itemsPerPage"

<pagination direction-links="false" boundary-links="true" total-items="filtered.length" items-per-page="itemsPerPage" ng-model="currentPage">

And the startFrom filter i'm using is:

angular.module('app')
  .filter('startFrom', function() {
    return function(input, start) {
        if(input) {return input.slice(start);}
    };
});
于 2014-05-28T18:51:54.147 回答
1

你的问题在于表达式

<div ng-repeat="group in filtered = (groups)|startFrom:(currentPage-1)*pageSize|limitTo:pageSize">

你应该filtered =像这样取出

<div ng-repeat="group in (groups)|startFrom:(currentPage-1)*pageSize|limitTo:pageSize">

另外,因为 angular 无法访问Math您,所以应该像这样将它应用于您的范围。

 $scope.Math = window.Math;
于 2013-09-13T23:58:04.850 回答