資源描述:
《angular 常用指令》由會(huì)員上傳分享,免費(fèi)在線閱讀,更多相關(guān)內(nèi)容在教育資源-天天文庫(kù)。
1、angular常用指令已經(jīng)用了angular很久積累了一些很實(shí)用的指令,需要的話直接拿走用,有問(wèn)題大家一起交流1.focus時(shí),input:text內(nèi)容全選angular.module('my.directives').directive('autoselect',[function(){return{restrict:'A',link:function(scope,element,attr){if(element.is("input")&&attr.type==="text"){varselected=false;vartime=
2、parseInt(attr["autoselect"]);element.bind("mouseup",function(e){if(selected){e.preventDefault();e.stopPropagation();}selected=false;});if(time>0){element.bind("focus",function(event){setTimeout(function(){selected=true;event.target.select();},time);});}else{element.bin
3、d("focus",function(event){selected=true;event.target.select();});}}}};}]);2.clickOutside指令,外部點(diǎn)擊時(shí)觸發(fā),click-outside="func()"func為自己指定的方法,一般為關(guān)閉當(dāng)前層的方法,inside-id=""點(diǎn)擊指定id的輸入框時(shí),當(dāng)前層不關(guān)閉angular.module('my.directives').directive('clickOutside',['$document',function($document){ret
4、urn{restrict:'A',link:function(scope,element,attrs){$(element).bind('mousedown',function(e){e.preventDefault();e.stopPropagation();});$("#"+attrs["insideId"]).bind('mousedown',function(e){e.stopPropagation();});$("#"+attrs["insideId"]).bind('blur',function(e){setTimeou
5、t(function(){scope.$apply(attrs.clickOutside);});});$document.bind('mousedown',function(){scope.$apply(attrs.clickOutside);});}};}]);3.clickInside指令,內(nèi)部點(diǎn)擊時(shí)觸發(fā)angular.module('my.directives').directive('clickInside',['$document',function($document){return{restrict:'A',link
6、:function(scope,element,attrs,ctrl){$(element).bind('focusclick',function(e){scope.$apply(attrs.clickInside);e.stopPropagation();});}};}]);4.scrollInside指令,內(nèi)部滾動(dòng)時(shí)觸發(fā)angular.module('my.directives').directive('scrollInside',function(){return{restrict:'A',link:function(scop
7、e,element,attrs,ctrl){$(element).bind('scroll',function(e){scope.$apply(attrs.scrollInside);e.stopPropagation();});}};});5.bindKeyBoardEvent指令,內(nèi)部獲得焦點(diǎn)或者點(diǎn)擊時(shí)觸發(fā)angular.module('my.directives').directive('bindKeyBoardEvent',function(){return{restrict:'A',link:function(scope,
8、element,attrs,ctrl){$(element).bind('focusclick',function(e){scope.$apply(attrs.bindKeyBoardEvent);e.stopPropagation(