规范 : 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 ...
随机推荐
- 10-instanceof
在Java中可以使用instanceof关键字判断一个对象到底是不是一个类的实例 package com.example; class A{ void tell1(){ System.out.prin ...
- 环信 之 iOS 客户端集成三:基础功能
SDK中,大部分与网络有关的操作,都有三种方法: 同步方法 通过delegate回调的异步方法.要想能收到回调,必须要注册为:[[EaseMob sharedInstance].chatManager ...
- constrain to margins
如果你点了constrain to margins,左右会有8个点的空挡,而是从8个点后开始计算约束,而没有点时,已屏幕的0点开始计算.
- php 禁用eval( )函数
php的eval函数并不是系统组件函数,因此我们在php.ini中使用disable_functions是无法禁止它的. 但是eval()对于php安全来说具有很大的杀伤力,因此一般不用的情况下为了防 ...
- 【WebStorm】前端工具开发利器webstrom专篇...更新中
http://my.oschina.net/maomi/blog/137807#OSC_h2_5 WebStorm混搭svn WebStorm混搭nodeJS webstorm简单介绍 webstor ...
- ThinkPHP创建应用的一般开发流程
使用ThinkPHP创建应用的一般开发流程是: 系统设计.创建数据库和数据表:(可选) 项目命名并创建项目入口文件,开启调试模式: 完成项目配置: 创建项目函数库:(可选) 开发项目需要的扩展(模式. ...
- php5.4下配置zend guard loader
前些日子的时候,zend官网下还没有支持PHP5.4的zend guard loader,今天再上去看的时候居然发现了,看来是我好久不关注它的缘故了... zend guard loader 干什么的 ...
- 编写快速、高效的JavaScript代码
许多Javascript引擎都是为了快速运行大型的JavaScript程序而特别设 计的,例如Google的V8引擎(Chrome浏览器,Node均使用该引擎).在开发过程中,如果你关心你程序的内存和 ...
- js url参数的获取和设置以及删除
//获取url参数的值:name是参数名 function getQueryString(name) { var reg = new RegExp("(^|&)" + na ...
- 【Scala】Scala之Numbers
一.前言 前面已经学习了Scala中的String,接着学习Scala的Numbers. 二.Numbers 在Scala中,所有的数字类型,如Byte,Char,Double,Float,Int,L ...