规范 : 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 ...
随机推荐
- [Angular Tutorial] 0-Bootstraping
在这一节的tutorial中,您将会逐渐熟悉AngularJS phonecat app的最重要的源代码文件.您也将学到如何将开发服务器与angular-seed绑定到一起,并且在浏览器中运行应用. ...
- 在vhd中安装win7,并建立分差vhd
准备:硬盘分区激活第一个分区; imagex.exe; install.wim; winpe boot pc 1.cmd命令下,创建主vhd (1)diskpart (打开dis ...
- PHP格式化字符串函数 sprintf()
定义和用法 sprintf() 函数把格式化的字符串写入一个变量中. 语法 sprintf(format,arg1,arg2,arg++) 参数 描述 format 必需.转换格式. arg1 必需. ...
- HoloLens开发手记 - 构建2D应用 Building 2D apps
HoloLens可以让我们在真实世界中看到全息图像内容.但是它本质上还是一台Windows 10设备,这意味着HoloLens可以以2D应用形式运行Windows Store里的大部分UWP应用. 目 ...
- HDU4474
Yet Another Multiple Problem Time Limit: 40000/20000 MS (Java/Others) Memory Limit: 65536/65536 K ...
- HDU5058
So easy Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 32768/32768 K (Java/Others)Total Sub ...
- Xamarin 小试牛刀 通知栏消息通知和按钮(基于Java代码人肉转换)
本示例基于网友现有安卓项目人肉翻译,在Xamarin中替换和修改了很多方法的命名,比如某些属性需要去掉getName的get前缀, 有些方法名称需要使用Pascal命名法替换Java的Camel 命名 ...
- Tooltip浮动提示框效果(掌握里面的小知识)
使用原生JavaScript设计和实现Tooltip浮动提示框特效,了解代码简化.事件绑定.事件冒泡等技巧和知识. 特效四个关键点:显示:鼠标移到ToolTip超链接上时,ToolTip提示框可以显示 ...
- 对Node.JS的事件轮询(Event Loop)的理解
title: Node.JS的事件轮询(event loop)的理解 categories: 理解 tags: Node JS 机制 当我们知道I/O操作和创建新线程的开销是巨大的! 网站延迟的开销 ...
- 前端基本知识(二):JS的原始链的理解
之前一直对于前端的基本知识不是了解很详细,基本功不扎实,但是前端开发中的基本知识才是以后职业发展的根基,虽然自己总是以一种实践是检验真理的唯一标准,写代码实践项目才是唯一,但是经常遇到知道怎么去解决这 ...