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 相关文章推荐
IE下支持文本框和密码框placeholder效果的JQuery插件分享
Jan 31 Javascript
JavaScript中数组添加值和访问值常见问题
Feb 06 Javascript
遍历js中对象的属性和值的实例
Nov 21 Javascript
jQuery插件zTree实现获取当前选中节点在同级节点中序号的方法
Mar 08 Javascript
canvas实现刮刮卡效果
Mar 14 Javascript
Angular2搜索和重置按钮过场动画
May 24 Javascript
限时抢购-倒计时的完整实例(分享)
Sep 17 Javascript
element 结合vue 在表单验证时有值却提示错误的解决办法
Jan 22 Javascript
jQuery实现简单评论功能
Aug 19 jQuery
详解JavaScript 高阶函数
Sep 14 Javascript
wepy--用vantUI 实现上弹列表并选择相应的值操作
Nov 03 Javascript
手把手教你如何编译打包video.js
Dec 09 Javascript
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
PHP4实际应用经验篇(5)
2006/10/09 PHP
php计算整个目录大小的方法
2015/06/01 PHP
php数字运算验证码的实现代码
2015/07/30 PHP
基于PHP实现商品成交时发送短信功能
2016/05/11 PHP
使用PHP连接多种数据库的实现代码(mysql,access,sqlserver,Oracle)
2016/12/21 PHP
学习js所必须要知道的一些
2007/03/07 Javascript
JS图片自动轮换效果实现思路附截图
2014/04/30 Javascript
利用原生JavaScript获取元素样式只是获取而已
2014/10/08 Javascript
js的touch事件的实际引用
2014/10/13 Javascript
浅谈JavaScript 执行环境、作用域及垃圾回收
2016/05/31 Javascript
原生js实现下拉框功能(支持键盘事件)
2017/01/13 Javascript
Bootstrap笔记之缩略图、警告框实例详解
2017/03/09 Javascript
js绑定事件和解绑事件
2017/04/27 Javascript
Underscore之Array_动力节点Java学院整理
2017/07/10 Javascript
JavaScript实现body内任意节点的自定义属性功能示例
2017/09/18 Javascript
关于React动态加载路由处理的相关问题
2019/01/07 Javascript
详细分析React 表单与事件
2020/07/08 Javascript
[02:31]2018年度DOTA2最具人气选手-完美盛典
2018/12/16 DOTA
用实例分析Python中method的参数传递过程
2015/04/02 Python
python实现下载整个ftp目录的方法
2017/01/17 Python
python中的不可变数据类型与可变数据类型详解
2018/09/16 Python
Python基于opencv调用摄像头获取个人图片的实现方法
2019/02/21 Python
Django打印出在数据库中执行的语句问题
2019/07/25 Python
Python描述符descriptor使用原理解析
2020/03/21 Python
使用python求斐波那契数列中第n个数的值示例代码
2020/07/26 Python
解决H5的a标签的download属性下载service上的文件出现跨域问题
2019/07/16 HTML / CSS
成人毕业生自我鉴定
2013/10/18 职场文书
自荐书4要点
2014/01/25 职场文书
渔夫的故事教学反思
2014/02/14 职场文书
《二泉映月》教学反思
2014/04/15 职场文书
企业文化理念标语
2014/06/10 职场文书
鸟的天堂导游词
2015/01/31 职场文书
实施意见格式范本
2015/06/05 职场文书
2015年“我们的节日·中秋节”活动总结
2015/07/30 职场文书
行政后勤人员工作计划应该怎么写?
2019/08/16 职场文书
Java实现带图形界面的聊天程序
2022/06/10 Java/Android