angular 全局常用指令
1.全局支持 enter快捷键触发事件
// 全局指令
app.directive('ngEnter', ['$window',"$timeout", ($window,$timeout) => {
return {
restrict: 'A',
link ($scope, element, attrs) {
element.bind('keypress', (ev) => {
ev = ev || $window.event;
if (event.keyCode === 13) {
$timeout(function () {
$scope.$eval(attrs.ngEnter);
});
//引入$timeout 解决渲染问题
ev.preventDefault ? ev.preventDefault() : ev.returnValue = false;
return false;
}
$window.event ? ev.cancelBubble=true : ev.stopPropagation();//清除冒泡
});
element.on('$destroy', function () {
element.unbind('keypress');
$scope.$destroy();
});
}
};
}]);
2.点击按钮之后禁用按钮,防止多重提交
app.directive('clickAndDisable', function() {
return {
scope: {
clickAndDisable: '&'
},
link: function(scope,element, iAttrs) {
element.bind('click', function() {
element.prop('disabled',true);
scope.clickAndDisable().finally(function() {
element.prop('disabled',false);
})
});
}
};
});
3.判断 ng-repeat 渲染完成后操作
app.directive('repeatFinish',function(){
return {
link: function(scope,element,attr){
if(scope.$last == true){
console.log("ng-repeat遍历完成");
scope.$eval( attr.repeatFinish )
}
}
}
});
angular 全局常用指令的更多相关文章
- Angular JS - 7 - Angular JS 常用指令2
<!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8&quo ...
- Angular JS - 6 - Angular JS 常用指令
<!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8&quo ...
- angular/cli 常用指令
1.安装@angular/cli npm install -g @angular/cli 2.更新@angular/cli npm uninstall -g @angular/cli npm cach ...
- Angular JS从入门基础 mvc三层架构 常用指令
Angular JS从入门基础 mvc模型 常用指令 ★ 最近一直在复习AngularJS,它是一款优秀的前端JS框架,已经被用于Google的多款产品当中.AngularJS有着诸多特性,最为核心 ...
- nvm配置及常用指令、配置全局node_global
1.nvm-windows下载 nvm下载链接点击最新版本nvm-setup.zip下载安装即可. 2.配置nvm环境变量(安装nvm会默认配置,可忽略) 环境变量打开方式:右键此电脑 > 属性 ...
- Vue系列(一):简介、起步、常用指令、事件和属性、模板、过滤器
一. Vue.js简介 1. Vue.js是什么 Vue.js也称为Vue,读音/vju:/,类似view,错误读音v-u-e 是一个轻量级MVVM(Model-View-ViewModel)框架,和 ...
- 走进AngularJs(二) ng模板中常用指令的使用方式
通过使用模板,我们可以把model和controller中的数据组装起来呈现给浏览器,还可以通过数据绑定,实时更新视图,让我们的页面变成动态的.ng的模板真是让我爱不释手.学习ng道路还很漫长,从模板 ...
- Angular.js之指令学习笔记
<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"& ...
- vue.js介绍,常用指令,事件,以及制作简易留言版
一.vue是什么? 一个mvvm框架(库).和angular类似,比较容易上手.小巧,让我们的代码更加专注于业务逻辑,而不是去关注DOM操作 二.vue和angular之间的区别 vue--简单易学 ...
随机推荐
- ThInkPHP验证码不显示,解决方法汇总
出现ThInkPHP验证码不显示的情况 官方提示如下:如果无法显示验证码,请检查:① PHP是否已经安装GD库支持:② 输出之前是否有任何的输出(尤其是UTF8的BOM头信息输出):(打开验证码文件为 ...
- Android LruCache源码简介
package android.util; import java.util.LinkedHashMap; import java.util.Map; /** * A cache that holds ...
- 对象无法注册到Spring容器中,手动从spring容器中拿到我们需要的对象
当前对象没有注册到spring容器中,此时无法new object() 的方式创建对象,否则所有@Autowired 注入的对象都为null; 处理方式: 手动创建一个类@Component注册到S ...
- Effective C++: 06继承与面向对象设计
32:确定你的public继承塑模出is-a关系 以C++进行面向对象编程,最重要的一个规则是:public继承表示的是"is-a"(是一种)的关系. 如果令class D以pub ...
- 2018年DDoS攻击全态势:战胜第一波攻击成“抗D” 关键
2018年,阿里云安全团队监测到云上DDoS攻击发生近百万次,日均攻击2000余次.目前阿里云承载着中国40%网站,为全球上百万客户提供基础安全防御.可以说,阿里云上的攻防态势是整个中国攻防态势的缩影 ...
- IDEA-servlet项目创建web项目
准备:1. 安装jdk1.82. 安装tomcat9.0(idea只支持4.0 9.0的服务器) 一.创建并设置javaweb工程 1.创建javaweb工程File --> New --&g ...
- 小爬爬7:回顾&&crawlSpider
1.回顾昨日内容 回顾 - 全站数据爬取(分页) - 手动请求的发送Request(url,callback) - post请求和cookie处理 - start_requests(self) - F ...
- 登录注册beta版
注册 login_count = 0 username_inp = input('请输入用户名:') while login_count < 3: pwd_inp = input('请输入密码: ...
- windows下多版本python安装与pip安装和pip使用 吐血总结
https://blog.csdn.net/silence2015/article/details/56483892/ 版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附 ...
- MUI - 关于百度定位
关于百度定位 这是官方定位的解释:geolocation 地图插件配置 我在问答里面找到了这位童鞋的百度定位,地址变更提醒 *** 不过,童鞋倒是给具体的示例啊,木有~~~~(>_<)~~ ...