1、angular-pagination

是基于angular 编写的可复用分页指令

安装

克隆项目到本地:

git clone https://github.com/febobo/angular-pagination.git

要跑demo环境要求:

node , bower , npm , gulp

安装: npm install && bower install

运行: gulp serve

demo用法

html

 <body ng-app="demo" ng-controller="demoCtro" class="row text-center">
<div ui-pagination conf="conf"></div>
</body>

JS

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

   app.controller('demoCtro' , function($scope){

       $scope.title = 'pagination-directive';

       $scope.conf = {

         // 总条数
total : 1190, // 当前页
currentPage : 1, // 一页展示多少条
itemPageLimit : 1, // 是否显示一页选择多少条
isSelectPage : false, // 是否显示快速跳转
isLinkPage : false
} // 监控你的页码 , 发生改变既请求
$scope.$watch('conf.currentPage + conf.itemPageLimit' , function(news){
// 把你的http请求放到这里
console.log($scope.conf.currentPage , $scope.conf.itemPageLimit)
})
})

AngularJs--angular-pagination可复用的分页指令的更多相关文章

  1. angular+bootstrap分页指令案例

    AngularJS中不仅内置了许多指令,而且开发人员也可以通过自定义指令来完成特殊操作,指令创建成功后可以到处复用. Web应用中的分页处理最为常见,我们可以将分页模块编写成一个可以复用的Angula ...

  2. angular分页指令

    目前的多个项目中都用到分页这个功能,为了提高可复用性,我特地分离出来写了个分页的指令.直接贴代码,详情如下: index.html <body id="sBill" ng-c ...

  3. Angular pagination分页模块 只提供分页参数处理 不处理分页记录数据

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  4. Angularjs进阶笔记(2)-自定义指令中的数据绑定

    有关自定义指令的scope参数,网上很多文章都在讲这3种绑定方式实现的效果是什么,但几乎没有人讲到底怎么使用,本篇希望聊聊到底怎么用这个话题. 一. 自定义指令 自定义指令,是Angularjs用来实 ...

  5. AngularJS入门心得3——HTML的左右手指令

    在<AngularJS入门心得1——directive和controller如何通信>我们提到“AngularJS是为了克服HTML在构建应用上的不足而设计的.HTML是一门很好的为静态文 ...

  6. 转载使用Flurl制作可复用的分页组件

    使用Flurl制作可复用的分页组件 使用ASP.NET MVC查询时,一直使用MvcPaging组件,虽然需要自定义MvcPaging.Pager才能达到我想要的效果,但在没有较好的URL库时,还是这 ...

  7. 使用第三方插件pagination在页面实现分页功能

    1.导入相应的js和css文件 2.在相应的页面映入pagination.js和pagination.css 3.将页面的分页代码替换为pagination动态生成的分页代码 4.编写js代码

  8. Angularjs+Bootstrap实现分页指令

    本插件的开发目的主要给前端同学使用,本人是专注于后台开发的,对css样式不熟悉,但逼于前端要求做一个共公组件方便日常开发,所以这个插件在样式上可能不适合大部分人,喜欢的拿走吧,不喜欢的也请别喷.  一 ...

  9. [Angularjs]angular ng-repeat与js特效加载先后导致的问题

    写在前面 最近在项目中遇到这样的一个前端的bug,在ng-repeat中绑定的图片,有一个晃动的特效,在手机端浏览的时候,图片有时候会正常展示,有时就展示不出来.当时猜测是因为angularjs与特效 ...

随机推荐

  1. PHP编程效率的20个要点

    用单引号代替双引号来包含字符串,这样做会更快一些.因为PHP会在双引号包围的字符串中搜寻变量,单引号则 不会,注意:只有echo能这么做,它是一种可以把多个字符串当作参数的“函数” 用 单引号代替双引 ...

  2. 获取文件hash值

    public string getFilesMD5Hash(string file)        {            //MD5 hash provider for computing the ...

  3. 20145205《Java程序设计》第四次实验:Android环境搭建

    实验内容 1.搭建Android环境 2.运行Android 3.修改代码,能输出学号 实验步骤 搭建Android环境 安装Android,核心是配置JDK.SDK 运行Android 总结感想: ...

  4. 为什么匿名内部类的参数必须为finalhttp://feiyeguohai.iteye.com/blog/1500108

    1)  从程序设计语言的理论上:局部内部类(即:定义在方法中的内部类),由于本身就是在方法内部(可出现在形式参数定义处或者方法体处),因而访问方法中的局部变量(形式参数或局部变量)是天经地义的.是很自 ...

  5. SQLite XXTea加密学习

    这几天优化数据库读写,移植了xxtea加密到最新的数据库sqlite 3.12.2里,一些好文章放在这里.移植后,数据库读写性能异常优秀! 这几天又发现,数据库还是发生了无法写入情况,数据库崩溃掉了. ...

  6. 使用JMeter进行简单的压力测试

    一.压力测试 顾名思义:压力测试,就是  被测试的系统,在一定的访问压力下,看程序运行是否稳定/服务器运行是否稳定(资源占用情况). 比如: 2000个用户同时到一个购物网站购物,这些用户打开页面的速 ...

  7. python垃圾回收机制的一些理解

    概览:       主要通过 引用计数来进行垃圾收集, 就是说,当一个对象没有被其他对象引用的时候,会释放掉内存.     但是会有一些循环引用的对象,通过上面的方法,是没有办法清除掉的.所以,pyt ...

  8. oracle 中的cascade

    级联删除,比如你删除某个表的时候后面加这个关键字,会在删除这个表的同时删除和该表有关系的其他对象

  9. Python Set Literals

    现有3种方式创建set() >>> def f(): ... return set([1, 2, 3]) ... >>> def h(): ... return s ...

  10. Java jdbc 连接oracle之三(封装工具类)

    driver = oracle.jdbc.driver.OracleDriver url = jdbc:oracle:thin:@192.168.10.105:1521:orcl user = LF ...