发表于: 2017-01-08 15:26:39
1 1480
今天完成的事情:
#分页显示效果完成明天计划的事情:
#过滤显示功能遇到的问题:
#在制作的过程中,功能已经实现了,但是浏览器还是报了一个错误,。不知道是什么意思,明天回来在处理
收获:
#关键参数
currentPage 当前页码
itemsPerPage 每页的记录数
filter过滤器的初步使用
思路已经对上轮子了
myApp.filter('paging',function(){ //paging 过滤器
return function(lists,start){ //两个参数 lists 是在 html 里你ng-repeat的原始数据:
// start 也就是 paging 后面传的参数,即 currentPage*listsPerPage
return lists.slice(start); //将原始数据按照 start 分割
};
});
myApp.controller('demoCtrl',function($scope,$http){ //页面控制器
$http.get("/student-ajax/students")
.success(function (data) {
$scope.names = data.data;
console.log(($scope.names).length)
$scope.dataNum = ($scope.names).length; //获得数据总个数
$scope.pages = Math.ceil($scope.dataNum/10); //按照每页显示3个数据,得到总页数
$scope.pageNum = []; //生成页码,在 html里 ng-repeat 出来
for(var i=0;i<$scope.pages;i++){
$scope.pageNum.push(i);
}
$scope.currentPage = 0; //设置当前页是 0
$scope.listsPerPage = 10; //设置每页显示 3 个
$scope.setPage = function(num){ // 当点击页码数字时执行的函数
$scope.currentPage = num; //将当前页 设置为 页码数
}
$scope.prevPage = function(){ //点击上一页执行的函数
if($scope.currentPage > 0){
$scope.currentPage--;
}
}
$scope.nextPage = function(){ //点击下一页执行的函数
if ($scope.currentPage < $scope.pages-1){
$scope.currentPage++;
}
}
});
});
评论