首先在页面引入分页插件

<script src="../plugins/angularjs/pagination.js"></script>
<link rel="stylesheet" href="../plugins/angularjs/pagination.css">

然后再挂载到模块上:

var app=angular.module('app',['pagination']);

在表格最底下加入:

<!-- 分页 -->
<tm-pagination conf="paginationConf"></tm-pagination>

这样就完成了,需要配置paginationConf,以及相关js

/重新加载列表 数据
$scope.reloadList=function(){
//切换页码
$scope.findPage( $scope.paginationConf.currentPage,
$scope.paginationConf.itemsPerPage);
}
//分页控件配置
$scope.paginationConf = {
currentPage: ,
totalItems: ,
itemsPerPage: ,
perPageOptions: [, , , , ],
onChange: function(){
$scope.reloadList();//重新加载
}
};
//分页
$scope.findPage=function(page,rows){
$http.get('../brand/findPage.do?page='+page+'&rows='+rows).success(
function(response){
$scope.list=response.rows;
$scope.paginationConf.totalItems=response.total;//更新总记录数
}
);
}

paginationConf 变量各属性的意义:
currentPage:当前页码
totalItems:总条数
itemsPerPage:
perPageOptions:页码选项
onChange:更改页面时触发事件

anglarJs分页的更多相关文章

  1. 记一次SQLServer的分页优化兼谈谈使用Row_Number()分页存在的问题

    最近有项目反应,在服务器CPU使用较高的时候,我们的事件查询页面非常的慢,查询几条记录竟然要4分钟甚至更长,而且在翻第二页的时候也是要这么多的时间,这肯定是不能接受的,也是让现场用SQLServerP ...

  2. js实现前端分页页码管理

    用JS实现前端分页页码管理,可以很美观的区分页码显示(这也是参考大多数网站的分页页码展示),能够有很好的用户体验,这也是有业务需要就写了一下,还是新手,经验不足,欢迎指出批评! 首先先看效果图: 这是 ...

  3. JdbcTemplate+PageImpl实现多表分页查询

    一.基础实体 @MappedSuperclass public abstract class AbsIdEntity implements Serializable { private static ...

  4. MVC如何使用开源分页插件shenniu.pager.js

    最近比较忙,前期忙公司手机端接口项目,各种开发+调试+发布现在几乎上线无问题了:虽然公司项目忙不过在期间抽空做了两件个人觉得有意义的事情,一者使用aspnetcore开发了个人线上项目(要说线上其实只 ...

  5. NET Core-TagHelper实现分页标签

    这里将要和大家分享的是学习总结使用TagHelper实现分页标签,之前分享过一篇使用HtmlHelper扩展了一个分页写法地址可以点击这里http://www.cnblogs.com/wangrudo ...

  6. 套用JQuery EasyUI列表显示数据、分页、查询

    声明,本博客从csdn搬到cnblogs博客园了,以前的csdn不再更新,朋友们可以到这儿来找我的文章,更多的文章会发表,谢谢关注! 有时候闲的无聊,看到extjs那么肥大,真想把自己的项目改了,最近 ...

  7. php实现的分页类

    php分页类文件: <?php /** file: page.class.php 完美分页类 Page */ class Page { private $total; //数据表中总记录数 pr ...

  8. C#关于分页显示

    ---<PS:本人菜鸟,大手子还请高台贵手> 以下是我今天在做分页时所遇到的一个分页显示问题,使用拼写SQL的方式写的,同类型可参考哦~ ------------------------- ...

  9. JAVA 分页工具类及其使用

    Pager.java package pers.kangxu.datautils.common; import java.io.Serializable; import java.util.List; ...

随机推荐

  1. 2014.10.1 Cmd更改系统时间

    Process p = new Process(); //Process类有一个StartInfo属性 //设定程序名 p.StartInfo.FileName = "cmd.exe&quo ...

  2. leetcode860

    使用C++进行编码: bool lemonadeChange(vector<int>& bills) { ; ; ; int N = bills.size(); ; i < ...

  3. linux命令-sudo普通用户拥有root权限

    普通用户权限不够 [root@wangshaojun ~]# su - dennywang[dennywang@wangshaojun ~]$ ls /root/ls: 无法打开目录/root/: 权 ...

  4. 用java代码解决10元喝多少瓶汽水的问题

    问题:汽水2元一瓶,四个盖子换一瓶,两个空瓶一瓶,问10元可以喝几瓶?(不许借别人空瓶或瓶盖,但可以先喝汽水再付空酒瓶或瓶盖) 最近同事让笔者看了一道脑筋急转弯的数学题,当然不是很难,只要会加减法应该 ...

  5. spring整合web项目演示

  6. js语法和数据类型

    基础知识(Basics) JavaScript 的很多语法借鉴自 Java,但也受 Awk,Perl 和 Python 影响. JavaScript 是大小写敏感的,使用 Unicode 字符集. 在 ...

  7. 【整理】使用AIDL跨进程传递复杂对象的实践例子

    首先定义对象类,并实现Parcelable接口,实现接口内的几个方法,看代码,Person.java package com.example.u3.aidltest; import android.o ...

  8. 02 mybatis环境搭建 【spring + mybatis】

    1 导包 <project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.o ...

  9. ROS Learning-014 learning_tf(编程) 坐标系变换(tf)广播员 (Python版)

    ROS Indigo learning_tf-01 坐标系变换(tf)广播员 (Python版) 我使用的虚拟机软件:VMware Workstation 11 使用的Ubuntu系统:Ubuntu ...

  10. Luogu 2312 [NOIP2014] 解方程

    感觉好无聊. 秦九昭算法:一般地,一元n次多项式的求值需要经过(n+1)*n/2次乘法和n次加法,而秦九韶算法只需要n次乘法和n次加法.在人工计算时,一次大大简化了运算过程.(百度百科) 具体来说怎么 ...