angular+springdatasolr实现原生分页功能

需求分析

实现代码&＃xff1a;

• 后台

//1.6 分页查询//1.页码 pageNoInteger pageNo &＃61; (Integer) searchMap.get("pageNo");//如果每页获取的页码,则设置默认是第一页if(pageNo &＃61;&＃61; null) {pageNo &＃61; 1;}//2.每页记录数 pageSize 每页默认展示20条数据Integer pageSize &＃61; (Integer) searchMap.get("pageSize");if(pageSize &＃61;&＃61; null) {pageSize &＃61; 20;}//3.//设置第几条记录开始查询query.setOffset((pageNo-1)*pageSize);//设置查询多少条记录query.setRows(pageSize);//返回总页数map.put("totalPages", page.getTotalPages());//返回总记录数map.put("total", page.getTotalElements());


前台&＃xff1a;

app.controller(&＃39;searchController&＃39;,function($scope,searchService){//搜索对象 分类category 品牌brand 规格spec 前端传递数据//&＃39;pageNo&＃39;:1 (初始页码) &＃39;pageSize&＃39;:40 (每页查询记录数)$scope.searchMap &＃61; {&＃39;keywords&＃39;: &＃39;&＃39;,&＃39;category&＃39;:&＃39;&＃39;,&＃39;brand&＃39;:&＃39;&＃39;,&＃39;spec&＃39;:{},&＃39;price&＃39;:&＃39;&＃39;,&＃39;pageNo&＃39;:1,&＃39;pageSize&＃39;:40};//搜索$scope.search &＃61; function(){//页码输入的数字进行类型转换$scope.searchMap.pageNo&＃61; parseInt($scope.searchMap.pageNo);searchService.search($scope.searchMap).success(function(response){//后台返回结果集$scope.resultMap &＃61; response;//价格数组$scope.priceArr &＃61; [&＃39;0-500&＃39;,&＃39;500-1000&＃39;,&＃39;1000-1500&＃39;,&＃39;1500-2000&＃39;,&＃39;2000-2500&＃39;,&＃39;2500-3000&＃39;,&＃39;3000-*&＃39;];//构建页码buildPageLabel();});}//添加搜索项$scope.addSearchItem &＃61; function(key,value){if(key &＃61;&＃61; &＃39;category&＃39; || key &＃61;&＃61; &＃39;brand&＃39;|| key &＃61;&＃61; &＃39;price&＃39;){ //如果点击的是分类或者品牌$scope.searchMap[key] &＃61; value; }else{$scope.searchMap.spec[key] &＃61; value;}$scope.search();}//移除面包屑选项$scope.removeSearchItem &＃61; function(key){if(key &＃61;&＃61; &＃39;category&＃39; || key &＃61;&＃61; &＃39;brand&＃39;|| key &＃61;&＃61; &＃39;price&＃39;){ //如果点击的是分类或者品牌$scope.searchMap[key] &＃61; &＃39;&＃39;;}else{delete $scope.searchMap.spec[key];}$scope.search();}//构建分页标签(totalPages为总页数)buildPageLabel&＃61;function(){//页码产生 数组$scope.pageLabel&＃61;[];//起始页var firstPage &＃61; 1;//尾页 var lastPage &＃61; $scope.resultMap.totalPages;//前面有点$scope.firstDot&＃61;true;//后边有点$scope.lastDot&＃61;true; //总页数&＃61; $scope.resultMap.totalPages; 当前页 &＃61; $scope.resultMap.pageNo**if($scope.resultMap.totalPages>5){if($scope.searchMap.pageNo<&＃61;3){//当前页 <&＃61; 3时 前面没点 $scope.firstDot &＃61; false;lastPage &＃61; 5;}// $scope.searchMap.pageNo>&＃61;lastPage-2 else if(lastPage-$scope.searchMap.pageNo<&＃61;2){ //当前页是倒数前3页时 后面没点 $scope.lastDot &＃61; false;firstPage &＃61; $scope.resultMap.totalPages - 4;}else{firstPage &＃61; $scope.searchMap.pageNo - 2;lastPage &＃61; $scope.searchMap.pageNo &＃43; 2;}}else{//当总页码 <&＃61; 5$scope.firstDot&＃61;false;//前面无点$scope.lastDot&＃61;false;//后边无点}//循环起始页 和尾页 加入数据入数组for(var i &＃61; firstPage;i <&＃61; lastPage;i&＃43;&＃43;){$scope.pageLabel.push(i);}**}//根据页码查询$scope.queryByPage&＃61;function(pageNo){//页码验证if(pageNo<1 || pageNo>$scope.resultMap.totalPages){return;} $scope.searchMap.pageNo&＃61;pageNo; $scope.search();}//判断当前页为第一页$scope.isTopPage&＃61;function(){if($scope.searchMap.pageNo&＃61;&＃61;1){return true;}else{return false;}}//判断当前页是否未最后一页$scope.isEndPage&＃61;function(){if($scope.searchMap.pageNo&＃61;&＃61;$scope.resultMap.totalPages){return true;}else{return false;}}});


页面&＃xff1a;