规范 : angular 组合 jquery plugin
jquery 会有document.ready ,这是会把model value 给 set 去 jquery ,如果set 不进,可能需要整个渲染(refresh)。在操作时需要找到接口,在找到value。
所以jquery api 必须找到
1. document ready point
2. set view value
3. get view value
4. refresh
5. on change
6. destroy
例子
//没有1 document ready 接口 & 4 refresh 接口
.directive('dtPicker', function () {
return {
require: '?ngModel',
restrict: 'A',
scope: {
viewMode: '@',
format: '@'
},
link: function (scope, element, attrs, ngModel) {
if (element[0]) {
element.datetimepicker({
format: scope.format,
}).on('dp.change', function (e) { //4 on change
var $picker = $(element).data("DateTimePicker");
var date = $picker.date().toDate(); //3 get view value
ngModel.$setViewValue(date);
});
}
var originRender = ngModel.$render;
ngModel.$render = function () {
originRender();
var $picker = element.data("DateTimePicker");
$picker.date(new Date(ngModel.$viewValue)); //2 set view value
}
scope.$on("$destroy", function () {
var $picker = $element.data("DateTimePicker");
$picker.destroy(); //6 destroy
});
}
}
})
规范 : angular 组合 jquery plugin的更多相关文章
- JQuery plugin ---- simplePagination.js API
CSS Themes "light-theme" "dark-theme" "compact-theme" How To Use Step ...
- jQuery plugin: Autocomplete 参数及实例
官网:jQuery plugin: Autocomplete (注:此插件已经不再更新.它的继任者是jQuery UI的一部分,) 此插件依赖于 jquery 1.2.6 --- j ...
- paip.提升效率--数据绑定到table原理和流程Angular js jquery实现
paip.提升效率--数据绑定到table原理和流程Angular js jquery实现 html #--keyword 1 #---原理和流程 1 #----jq实现的代码 1 #-----An ...
- Signs of a poorly written jQuery plugin 翻译 (Jquery插件开发注意事项,Jquey官方推荐)
原文链接:http://remysharp.com/2010/06/03/signs-of-a-poorly-written-jquery-plugin/ 原文作者:remy sharp So far ...
- JQuery Plugin 1 - Simple Plugin
1. How do you write a plugin in jQuery? You can extend the existing jQuery object by writing either ...
- Angular和jQuery的ajax请求的差别
近期项目中使用angular,结果发现后台没法获取參数,所以,略微研究了一下两者在发送ajax时的差别. 注意angular和jquery的ajax请求是不同的. 在jquery中,官方文档解释con ...
- The ultimate jQuery Plugin List(终极jQuery插件列表)
下面的文章可能出自一位奥地利的作者, 列出很多jQuery的插件.类似的网站:http://jquerylist.com/原文地址: http://www.kollermedia.at/archiv ...
- [jQuery] 自做 jQuery Plugin - Part 1
有時候寫 jQuery 時,常會發現一些簡單的效果可以重複利用.只是每次用 Copy & Paste 大法似乎不是件好事,有沒有什麼方法可以讓我們把這些效果用到其他地方呢? 沒錯,就是用 jQ ...
- ollicle.com: Biggerlink – jQuery plugin
ollicle.com: Biggerlink – jQuery plugin Biggerlink – jQuery plugin Purpose Demo Updated for jQuery 1 ...
随机推荐
- Leetcode 181. Employees Earning More Than Their Managers
The Employee table holds all employees including their managers. Every employee has an Id, and there ...
- 创建 Web 前端开发环境(node和npm)
Web 前端开发涉及多种工具,这里将常用工具的安装和配置进行说明,提供了详细的说明,为后继的开发创建一个坚实的基础. 本文介绍的工具有:NodeJS, NPM, Bower, Git 和 Grunt. ...
- linux下简单限制网卡速度
Linux下限制网卡的带宽,可用来模拟服务器带宽耗尽,从而测试服务器在此时的访问效果. 1.安装iproute yum -y install iproute 2.限制eth0网卡的带宽为50kbit: ...
- jquery的动画函数animate()讲解一
jquery animate 动画效果使用说明 animate( params, [duration], [easing], [callback] ) 用于创建自定义动画的函数. 这个函数的关键在于指 ...
- 转对象(含length属性)成数组Array.prototype.slice.call(arguments)
我们知道,Array.prototype.slice.call(arguments)能将具有length属性的对象转成数组,除了IE下的节点集合(因为ie下的dom对象是以com对象的形式实现的,js ...
- iOS 引导页
1. 目标需求 引导页无限轮播,且轮播到最后一张时没有跳转到头一个的感觉 pageControl的显示为可选项 是否无限轮播为可选项 手动切换图片,并再次启动自动轮转 实现点击事件 2. 实现思路 初 ...
- 建立、配置和使用Activity——启动其他Activity并返回结果
Activity还提供了一个startActivityForResult(Intent intent,int requestCode)方法来启动其他Activity.该方法用于启动指定Activity ...
- swift 启动图片的设置
1 .找到Assets.xcassets 2. 在Assets.xcassets里创建 New LaunchImage 拖入相应的图片 3.选中你的项目,点击General 在App Icons an ...
- Java数据库连接--JDBC调用存储过程,事务管理和高级应用
相关链接:Jdbc调用存储过程 一.JDBC常用的API深入详解及存储过程的调用 1.存储过程的介绍 我们常用的操作数据库语言SQL语句在执行的时候要先进行编译,然后执行,而存储过程是在大型数据库系统 ...
- EditText的功能与用法
EditText与TextView非常相似,它甚至与TextView共用了绝大部分XML属性和方法.EditText和TextView的最大区别在于:EditText可以接受用户输入. EditTex ...