首先在页面引入分页插件

<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. Windows下自由创建.htaccess文件的N种方法

    .htaccess是apache的访问控制文件,apache中httpd.conf的选项配合此文件,完美实现了目录.站点的访问控 制,当然最多的还是rewrite功能,即URL重写,PHP中实现伪静态 ...

  2. Synchronized关键字、Lock,并解释它们之间的区别

    Synchronized 与Lock都是可重入锁,同一个线程再次进入同步代码的时候.可以使用自己已经获取到的锁. Synchronized是悲观锁机制,独占锁.而Locks.ReentrantLock ...

  3. maven手动安装oracle驱动到仓库

    1. 2.打开http://maven.jahia.org/maven2/一步步打开找到 我需要的版本 https://devtools.jahia.com/nexus/content/groups/ ...

  4. ascii#ascii,对象类中找__repr__,获取其返回值

    #!/usr/bin/env python #ascii,对象类中找__repr__,获取其返回值 class Foo : def __repr__(self): return "hello ...

  5. Android中pull解析XML文件的简单使用

    首先,android中解析XML文件有三种方式,dom,sax,pull 这里先讲pull,稍候会说SAX和DOM pull是一种事件驱动的xml解析方式,不需要解析整个文档,返回的值是数值型,是推荐 ...

  6. 数字调节控件JSpinner的使用

    ---------------siwuxie095                         工程名:TestUI 包名:com.siwuxie095.ui 类名:TestList.java   ...

  7. 用C++实现void reverse(char* str)函数,即反转一个null结尾的字符串.

    void reverse(char* str) { char *end = str, *begin=str; char temp; while(*end!='\0') { end++; } end-- ...

  8. Entity Framework Tutorial Basics(37):Lazy Loading

    Lazy Loading: One of the important functions of Entity Framework is lazy loading. Lazy loading means ...

  9. spark sql建表的异常

    在使用spark sql创建表的时候提示如下错误: missing EOF at 'from' near ')' 可以看下你的建表语句中是不是create external table ....   ...

  10. Java50道经典习题-程序47 输入数字打印星号

    题目:读取7个数(1—50)的整数值,每读取一个值,程序打印出该值个数的*. import java.util.Scanner; public class Prog47{ public static ...