您的位置:首页 > Web前端 > AngularJS

angularjs之ui Bootstrap翻页效果

2017-07-28 11:16 218 查看
基本逻辑思维

获取列表的个数

每页显示多少个

当前是第几页

$scope.currentPage = 1;  //当前页是第一页
$scope.pageSize = 6;   //每页显示6个数据
$scope.totalItems = data.list.length;   //获取数据的个数
$scope.list = data.list;    //获取所有数据列表信息
$scope.pageChanged($scope.currentPage);   //改变当前页数
$scope.pageChanged = function (index) {
$scope.currentPage = index;   //改变当前页为index
$scope.collectionlist = $scope.list.slice((index - 1) * $scope.pageSize, index * $scope.pageSize);
循环的列表信息为 在所有的数据中选取数据,从0开始选择,到当前页乘以每页的数据,显示结果如下
如果list为60,选取的数据第一页为0 - 1*6 选取第0,1,2,3,4,5条数据 选取数据从0开始
第二页为(index也就是2-1)*6 —— 2*6  也就是从6开始,到12 选取第6,7,8,9,10,11条数据
}
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: