Angularjs分页指数问题?

时间:2016-05-30 10:04:26

标签: angularjs twitter-bootstrap-3 pagination

这里我试图改变分页索引,问题是索引对于分页中的每个页面都显示相同,所以我想通常改变它。 这里我有plunker链接plunker

<li class="" ng-repeat="datalist in datalists | pagination: curPage * pageSize | limitTo: pageSize">
     <div>
       {{$index+1}}
       <span>{{ datalist.name }} </span>
       <span>
         {{ datalist.age }}
         </span>
         <span>{{ datalist.designation }}</span>
         </div> 
 </li>



<div class="pagination pagination-centered" ng-show="datalists.length">
<ul class="pagination-controle pagination">
 <li>
  <button type="button" class="btn btn-primary" ng-disabled="curPage == 0"
 ng-click="curPage=curPage-1"> &lt; PREV</button>
 </li>
 <li>
 <span>Page {{curPage + 1}} of {{ numberOfPages() }}</span>
 </li>
 <li>
 <button type="button" class="btn btn-primary"
 ng-disabled="curPage >= datalists.length/pageSize - 1"
 ng-click="curPage = curPage+1">NEXT &gt;</button>
 </li>
</ul>
</div>

此处索引应该对每个页面都相同,但它显示第二页的新数字

.js文件

 $scope.curPage = 0;
 $scope.pageSize = 3;
 $scope.numberOfPages = function() {
                return Math.ceil($scope.datalists.length / $scope.pageSize);
            };

angular.module('sampleapp').filter('pagination', function()
{
 return function(input, start)
 {
  start = +start;
  return input.slice(start);
 };
});

1 个答案:

答案 0 :(得分:1)

这是因为$index只是在应用任何过滤器之后跟踪重复的项目索引

尝试将{{$index+1}}更改为{{$index + 1 + (curPage * pageSize)}}作为解决方法。

Updated plunkr