首先在页面引入分页插件

<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. C语言学习笔记--内存分区

    1. 程序中的栈 1.1 栈的简介 (1)栈中现代计算机程序里最为重要的概念之一 (2)栈在程序中用于维护函数调用上下文 (3)函数中的参数和局部变量存储在栈上 (4)栈保存了一个函数调用所需的维护信 ...

  2. 4-EasyNetQ之Logging(黄亮翻译)

    EasyNetQ提供了一个Logger接口 IEasyNetQLogger: public interface IEasyNetQLogger { void DebugWrite(string for ...

  3. java判断姓是否合格 千家姓

    package com.sycx.domain; import java.lang.reflect.Array; public class FirstName { public static bool ...

  4. Eclipse Maven 编译错误 Dynamic Web Module 3.0 requires Java 1.6 or newer 解决方案

    Eclipse Maven 开发一个 jee 项目时,编译时遇到以下错误:Description Resource Path Location TypeDynamic Web Module 3.0 r ...

  5. 剑指offer 38_统计数组中k出现的个数

    思路: 二分法,分别找出第一个和最后一个k出现的位置.相减 加一 #include <stdio.h> //获取第一个K的位置 int getFirstK (int k,int *numb ...

  6. PHP自定义函数获取汉字首字母的方法

    使用场景:城市列表等根据首字母排序的场景 function getFirstCharter($str) { if (empty($str)) { return ''; } $fchar = ord($ ...

  7. 【Java基础专题】编码与乱码(05)---GBK与UTF-8之间的转换

    原文出自:http://www.blogjava.net/pengpenglin/archive/2010/02/22/313669.html 在很多论坛.网上经常有网友问" 为什么我使用 ...

  8. HDU 4879 ZCC loves march (并查集,set,map)

    题面以及思路:https://blog.csdn.net/glqac/article/details/38402101 代码: #include <bits/stdc++.h> #defi ...

  9. No bean class specified on bean definition 解决方案

    调试Spring项目出现No bean class specified on bean definition异常 但是控制台并没有给出其他相关信息了 这个时候可以在AbstractBeanDefini ...

  10. 将字符串str1复制为字符串str2的三种方法

    1.自己编写函数,将两个字符串进行复制 #include<iostream> using namespace std; int main(){ char str1[]="I lo ...