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一元操作符(递增、递减)使用示例
Aug 07 Javascript
一些老手都不一定知道的JavaScript技巧
May 06 Javascript
一波JavaScript日期判断脚本分享
Mar 06 Javascript
分享jQuery网页元素拖拽插件
Dec 01 Javascript
js Date()日期函数浏览器兼容问题解决方法
Sep 12 Javascript
vue mintui-Loadmore结合实现下拉刷新和上拉加载示例
Oct 12 Javascript
Vue框架里使用Swiper的方法示例
Sep 20 Javascript
JavaScript格式化json和xml的方法示例
Jan 22 Javascript
JavaScript前端页面搜索功能案例【基于jQuery】
Jul 10 jQuery
layui table设置某一行的字体颜色方法
Sep 05 Javascript
Javascript摸拟自由落体与上抛运动原理与实现方法详解
Apr 08 Javascript
深入了解JavaScript词法作用域
Jul 29 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
php echo 输出字符串函数详解
2010/05/13 PHP
一道求$b相对于$a的相对路径的php代码
2010/08/08 PHP
PHP代码优化之成员变量获取速度对比
2014/02/28 PHP
php的XML文件解释类应用实例
2014/09/22 PHP
thinkphp实现like模糊查询实例
2014/10/29 PHP
PHP微信开发之查询微信精选文章
2016/06/23 PHP
JavaScript高级程序设计(第3版)学习笔记7 js函数(上)
2012/10/11 Javascript
谈谈关于JavaScript 中的 MVC 模式
2013/04/11 Javascript
jQuery中fadeIn、fadeOut、fadeTo的使用方法(图片显示与隐藏)
2013/05/08 Javascript
关于JS中的闭包浅谈
2013/08/23 Javascript
jQuery动画效果-slideUp slideDown上下滑动示例代码
2013/08/28 Javascript
JavaScript实现简单图片滚动附源码下载
2014/06/17 Javascript
纯javascript实现自动发送邮件
2015/10/21 Javascript
学习使用AngularJS文件上传控件
2016/02/16 Javascript
js select下拉联动 更具级联性!
2020/04/17 Javascript
jQuery实现select下拉框获取当前选中文本、值、索引
2017/05/08 jQuery
浅析vue-router jquery和params传参(接收参数)$router $route的区别
2018/08/03 jQuery
实例详解带参数的 npm script
2019/05/28 Javascript
vue-cli3+ts+webpack实现多入口多出口功能
2019/05/30 Javascript
关于vue2强制刷新,解决页面不会重新渲染的问题
2019/10/29 Javascript
Angular之jwt令牌身份验证的实现
2020/02/14 Javascript
Javascript数组及类数组相关原理详解
2020/10/29 Javascript
iview实现动态表单和自定义验证时间段重叠
2021/01/10 Javascript
使用Python构建Hopfield网络的教程
2015/04/14 Python
python获取服务器响应cookie的实例
2018/12/28 Python
Scholastic父母商店:儿童书籍
2017/01/01 全球购物
美国知名的摄影器材销售网站:Adorama
2017/02/01 全球购物
东南亚冒险旅行与活动:Adventoro
2019/10/16 全球购物
创业计划书模版
2014/02/05 职场文书
个人纪律作风整改措施思想汇报
2014/10/12 职场文书
小学优秀教师先进事迹材料
2014/12/16 职场文书
安全保证书怎么写
2015/02/28 职场文书
忠诚与背叛观后感
2015/06/04 职场文书
2016年“我们的节日·端午节”活动总结
2016/04/01 职场文书
微信小程序用户授权最佳实践指南
2021/05/08 Javascript
详解Spring Security中的HttpBasic登录验证模式
2022/03/17 Java/Android