Angularjs分页查询的实现


Posted in Javascript onFebruary 24, 2017

 angularjs实现分页查询功能的实例代码,具体代码如下所示:

//首页导入<script type="text/javascript" src="framework/tm.pagination.js"></script> 
//routerApp中注入'tm.pagination' 
//html页面上<tm-pagination conf="paginationConf"></tm-pagination> 
//controller.js代码 
var reSearch = function() { 
  var postData = { 
    //发送给后台的请求数据 
    currentPage: $scope.paginationConf.currentPage, 
    pageSize: $scope.paginationConf.itemsPerPage, 
    pickup: $scope.pickups, 
    startTime: $scope.startTime, 
    endTime: $scope.endTime, 
    minMoney: $scope.minMoney, 
    maxMoney: $scope.maxMoney 
  }; 
  $http.post('后台分页接口', postData).success(function(response) { 
    $scope.paginationConf.totalItems = response.totalElements; //总条数 
    $scope.takeGoodsLists = response.content; //具体内容 
    //共享的数据赋值 
  }); 
} 
$scope.reSearch = reSearch; 
//配置分页基本参数 
$scope.paginationConf = { 
  currentPage: 1, //起始页 
  //totalItems:300,//总共有多少条记录 
  itemsPerPage: 5, // 每页展示的数据条数 
  //pagesLength:5,//分页条目的长度 
  perPageOptions: [5, 10, 20] //可选择显示条数的数组 
}; 
//当页码和页面记录数发生变化时监控后台查询如果把currentPage和itemsPerPage分开监控的话则会触发两次后台事件。 
$scope.$watch('paginationConf.currentPage + paginationConf.itemsPerPage', reSearch);
Javascript 相关文章推荐
javascript onkeydown,onkeyup,onkeypress,onclick,ondblclick
Feb 04 Javascript
基于jquery用于查询操作的实现代码
May 10 Javascript
ASP.NET jQuery 实例14 在ASP.NET form中校验时间范围
Feb 03 Javascript
复制js对象方法(详解)
Jul 08 Javascript
jquery检测input checked 控件是否被选中的方法
Mar 26 Javascript
get(0).tagName获得作用标签示例代码
Oct 08 Javascript
jquery实现上下左右滑动的方法
Feb 09 Javascript
javascript从作用域链谈闭包
Jul 29 Javascript
学习Node.js模块机制
Oct 17 Javascript
AngularJS实现与Java Web服务器交互操作示例【附demo源码下载】
Nov 02 Javascript
HTML5 JS压缩图片并获取图片BASE64编码上传
Nov 16 Javascript
JQuery 获取Dom元素的实例讲解
Jul 08 jQuery
vuejs2.0运用原生js实现简单的拖拽元素功能示例
Feb 24 #Javascript
Angular.js实现多个checkbox只能选择一个的方法示例
Feb 24 #Javascript
canvas实现图片根据滑块放大缩小效果
Feb 24 #Javascript
详解JS中的立即执行函数
Feb 24 #Javascript
几行js代码实现自适应
Feb 24 #Javascript
javascript 删除数组元素和清空数组的简单方法
Feb 24 #Javascript
JavaScript基本类型值-Number类型
Feb 24 #Javascript
You might like
用session做客户验证时的注意事项
2006/10/09 PHP
php+highchats生成动态统计图
2014/05/21 PHP
避免Smarty与CSS语法冲突的方法
2015/03/02 PHP
PHP中多线程的两个实现方法
2016/10/14 PHP
php7安装mongoDB扩展的方法分析
2017/08/02 PHP
PHP中的empty、isset、isnull的区别与使用实例
2019/03/22 PHP
Laravel 实现Eloquent模型分组查询并返回每个分组的数量 groupBy()
2019/10/23 PHP
Laravel 集成微信用户登录和绑定的实现
2019/12/27 PHP
关于js中window.location.href,location.href,parent.location.href,top.location.href的用法与区别
2010/10/18 Javascript
JS/jQuery实现默认显示部分文字点击按钮显示全部内容
2013/05/13 Javascript
javascript 控制input只允许输入的各种指定内容
2014/06/19 Javascript
使用Raygun对Node.js应用进行错误处理的方法
2015/06/23 Javascript
js实现仿Discuz文本框弹出层效果
2015/08/13 Javascript
全面解析Bootstrap表单使用方法(表单样式)
2015/11/24 Javascript
解决Layui数据表格中checkbox位置不居中的方法
2018/08/15 Javascript
jQuery常见的遍历DOM操作详解
2018/09/05 jQuery
小程序测试后台服务的方法(ngrok)
2019/03/08 Javascript
使用layer弹窗提交表单时判断表单是否输入为空的例子
2019/09/26 Javascript
vue 实现强制类型转换 数字类型转为字符串
2019/11/07 Javascript
借助云开发实现小程序短信验证码的发送
2020/01/06 Javascript
vue自定义指令和动态路由实现权限控制
2020/08/28 Javascript
Vue切换Tab动态渲染组件的操作
2020/09/21 Javascript
[01:14:35]DOTA2上海特级锦标赛B组资格赛#1 Alliance VS Fnatic第一局
2016/02/26 DOTA
python编程-将Python程序转化为可执行程序[整理]
2007/04/09 Python
Python实现嵌套列表及字典并按某一元素去重复功能示例
2017/11/30 Python
Django中url的反向查询的方法
2018/03/14 Python
flask框架单元测试原理与用法实例分析
2019/07/23 Python
django项目用higcharts统计最近七天文章点击量
2019/08/17 Python
python实现mean-shift聚类算法
2020/06/10 Python
校班主任推荐信范文
2013/12/03 职场文书
小学向国旗敬礼活动方案
2014/09/27 职场文书
打架赔偿协议书范本
2014/10/26 职场文书
2015最新学生自我评价范文
2015/03/03 职场文书
在职证明格式样本
2015/06/15 职场文书
公司欠款证明
2015/06/24 职场文书
2019入党申请书范文3篇
2019/08/21 职场文书