$index 对于所有使用 dir-paginate 的页面都是固定的

Question

我在 Angular 应用程序中使用 dirPaginate 指令进行分页。它工作正常，但问题是我每页显示 10 条记录，但在每一页上 $index 在每一页上重复相同的 (1-10)。它应该是 11-20,21-30 等等下一个 pages.help 我如何修复它。这是我的代码

<tbody dir-paginate="wagedtl in listWagemasterdtls | orderBy:orderByField:reverseSort | filter : detailsfilter |itemsPerPage:10">
<tr><td class="hidden-xs">{{ wagedtl.wageTypeMstrID}}</td><td>{{wagedtl.wageTypeMstrNm}}</td></tr> 
<dir-pagination-controls max-size="5" direction-links="true" boundary-links="true"></dir-pagination-controls>

Answer 1

这就是 dir-paginate 使用的 ng-repeat 的工作原理。我认为它应该是 0-9 而不是 1-10。

要计算整个页面的实际索引，您可以使用 current-page 属性将当前页面设置为属性。

<tbody dir-paginate="..." current-page="currentPage">

然后就可以在模板

中使用属性

$index + currentPage * 10

https://github.com/michaelbromley/angularUtils/blob/master/src/directives/pagination/README.md

Answer 2

我用我的方式解决了。我通过 dir-pagination-controls 的 on-page-change 事件调用了页面更改函数并发送了 'newPageNumber'

<dir-pagination-controls max-size="5" direction-links="true" boundary-links="true" on-page-change='indexCount(newPageNumber)'></dir-pagination-controls>

在控制器中我在函数中使用了这个逻辑

$scope.indexCount = function(newPageNumber){
    $scope.serial = newPageNumber * 10 - 9;
}

并将 'serial' 与 html

中的 $index 绑定

<td>{{ $index + serial}}</td>

默认情况下，newPageNumber 是未定义的。所以我只是保持 'serial' 的默认值等于 1. 在控制器

的开头

$scope.serial = 1;

可能这不是最好的方法，但我的问题现在已经解决了...:D

Answer 3

使用 $scope 变量设置 itemsPerPage 的值。

<tr dir-paginate="item in allProductData" itemsPerPage:itemPerPage" >

在on-page-change

中添加一个功能

 <dir-pagination-controls max-size="5" on-page-change='indexCount(newPageNumber)'
                                                 direction-links="true"
                                                 boundary-links="true">
                        </dir-pagination-controls>

然后在javascript文件中创建这个函数：

  $scope.serial = 1;
$scope.itemPerPage=5
$scope.indexCount = function(newPageNumber){

    $scope.serial = newPageNumber * $scope.itemPerPage - ($scope.itemPerPage-1);
}

您可以通过更改 $scope.itemPerPage 变量来更改 itemsPerPage 的值。

就是这样。现在您将在连续过程中获得您的页面索引。

$index 对于所有使用 dir-paginate 的页面都是固定的

$index is fixed for all pages using dir-paginate

javascript

pagination

angularjs

dirpagination