ANGULARJS中使用JQUERY分页控件


Posted in Javascript onSeptember 16, 2015

首篇,不知写何物,思来想去,敬上分页控件使用方法,望共同探讨。

分页乃前端数据展现之常用功能,而在我们使用的Angular js中,原生的分页需要将数据全部取到前端后,然后再到前端分页,在大批量数据操作时并不实用。接下来,我来介绍了将一种jquery的分页控件修改为Angularjs指令的方法。

首先在web项目中引用jquery1.10、Angularjs库文件以及jq-pagination控件。

我降指令名称为custompagination,为指令添加Html样式。

ANGULARJS中使用JQUERY分页控件

然后给指令添加对应的控制器。

ANGULARJS中使用JQUERY分页控件

指令使用时,html页面代码如下

ANGULARJS中使用JQUERY分页控件

对应控制器数据获取的方法为

ANGULARJS中使用JQUERY分页控件

控件的最终使用效果。

ANGULARJS中使用JQUERY分页控件

注意事项:jquery控件的调用更多的是使用一种同步的方式,而Angularjs获取后台数据则全部采用的是异步方式,在同时使用jquery和Angularjs时需要注意将两种不同的编程思想结合起来。在本例中最大的问题是在使用Angularjs获取后台数据后如何将新的分页情况通知给jquery分页控件,然后刷新分页控件的页面数据。本例是在Angularjs和jquery代码中各进行一次回调来实现的。其实也可以在Angularjs指令中使用watch来监视分页控件数据的变化达到刷新页面的目的,欢迎各位作进一步的探索。

Javascript 相关文章推荐
JQUERY操作JSON实例代码
Feb 09 Javascript
jQuery select操作控制方法小结
May 26 Javascript
详解JavaScript中undefined与null的区别
Mar 29 Javascript
jQuery响应enter键的实现思路
Apr 18 Javascript
推荐6款基于jQuery实现图片效果插件
Dec 07 Javascript
jQuery操作JSON的CRUD用法实例
Feb 25 Javascript
总结AngularJS开发者最常犯的十个错误
Aug 31 Javascript
Html5 js实现手风琴效果
Apr 17 Javascript
vue.js源代码core scedule.js学习笔记
Jul 03 Javascript
收藏AngularJS中最重要的核心功能
Jul 09 Javascript
jQuery实现点击下拉框中的值累加到文本框中的方法示例
Oct 28 jQuery
微信小程序学习笔记之登录API与获取用户信息操作图文详解
Mar 29 Javascript
js实现tab切换效果实例
Sep 16 #Javascript
JS实现自动固定顶部的悬浮菜单栏效果
Sep 16 #Javascript
jQuery图片轮播滚动切换代码分享
Apr 20 #Javascript
JS实现光滑展开合拢的菜单效果代码
Sep 16 #Javascript
jQuery实现两款有动画功能的导航菜单代码
Sep 16 #Javascript
javascript中的previousSibling和nextSibling的正确用法
Sep 16 #Javascript
Javascript实现商品秒杀倒计时(时间与服务器时间同步)
Sep 16 #Javascript
You might like
谈一谈收音机的高放电路
2021/03/02 无线电
wiki-shan写的php在线加密的解密程序
2008/09/07 PHP
PHP 基本语法格式
2009/12/15 PHP
PHP过滤黑名单关键字的方法
2014/12/01 PHP
php从给定url获取文件扩展名的方法
2015/03/14 PHP
PHP整合七牛实现上传文件
2015/07/03 PHP
PHP中关键字interface和implements详解
2017/06/14 PHP
php生成随机数/生成随机字符串的方法小结【5种方法】
2020/05/27 PHP
理解Javascript_09_Function与Object
2010/10/16 Javascript
javascript中创建对象的三种常用方法
2010/12/30 Javascript
从jQuery.camelCase()学习string.replace() 函数学习
2011/09/13 Javascript
深入理解jquery跨域请求方法
2016/05/18 Javascript
Node.js中使用jQuery的做法
2016/08/17 Javascript
浅析jQuery操作select控件的取值和设值
2016/12/07 Javascript
webpack打包js的方法
2018/03/12 Javascript
ZK中使用JS读取客户端txt文件内容问题
2019/11/07 Javascript
vue使用swiper.js重叠轮播组建样式
2019/11/14 Javascript
JS精确判断数据类型代码实例
2019/12/18 Javascript
微信小程序实现简单购物车功能
2020/12/30 Javascript
linux系统使用python获取cpu信息脚本分享
2014/01/15 Python
使用matplotlib动态刷新指定曲线实例
2020/04/23 Python
如何基于Python爬取隐秘的角落评论
2020/07/02 Python
python 基于Apscheduler实现定时任务
2020/12/15 Python
html5构建触屏网站之网站尺寸探讨
2013/01/07 HTML / CSS
英国女性时尚精品店:THE DRESSING ROOM
2018/05/23 全球购物
某IT外企面试题-二分法求方程!看看大家的C++功底
2015/07/04 面试题
教师队伍管理制度
2014/01/14 职场文书
旅游管理毕业生自荐书
2014/02/02 职场文书
ktv总经理岗位职责
2014/02/17 职场文书
在校实习生求职信
2014/06/18 职场文书
介绍信怎么写
2015/01/30 职场文书
2016春节家属慰问信
2015/03/25 职场文书
社区法制宣传日活动总结
2015/05/05 职场文书
心理学培训心得体会
2016/01/22 职场文书
Django如何创作一个简单的最小程序
2021/05/12 Python
Python数据可视化之Seaborn的安装及使用
2022/04/19 Python