利用Angular.js编写公共提示模块的方法教程


Posted in Javascript onMay 28, 2017

前言

在编写一些大型工程的时候,会经常遇到一些公用提示,使用框架自带很多时候不方便,于是我手写了一个,下面来看看详细的介绍:

效果图如下

利用Angular.js编写公共提示模块的方法教程

方法如下

一、先在angular中注册一个模块

利用Angular.js编写公共提示模块的方法教程

二、

利用Angular.js编写公共提示模块的方法教程
注册一个模块 注入依赖

三、

利用Angular.js编写公共提示模块的方法教程
返回不同的方法应对不同情况

四、

利用Angular.js编写公共提示模块的方法教程
获取模板路径

五、

利用Angular.js编写公共提示模块的方法教程
编写模板内容 和普通的页面一样调用使用angular服务

六、

利用Angular.js编写公共提示模块的方法教程

      1. 开启http服务获取模板内容

      2.  重点注意 $template = $compile(template)(scope); 这句代码非常重要  用于激活模板内容转成angular能识别的html代码片段

      3.提示框消失时间 设置回调函数 $template.detach();用于模板消失

七、

利用Angular.js编写公共提示模块的方法教程
设置html代码内的变量

      1.由于不在控制层 $scope对象无法获取不了值  所有需要用代替值  需要在使用时将$scope传入

八、使用方法如下

利用Angular.js编写公共提示模块的方法教程
记得在控制器里面注入alertModel模块

九、使用效果

利用Angular.js编写公共提示模块的方法教程

总结

以上就是这篇文章的全部内容了,希望本文的内容对大家的学习或者工作能带来一定的帮助,如果有疑问大家可以留言交流,谢谢大家三水点靠木的支持。

Javascript 相关文章推荐
js数组循环遍历数组内所有元素的方法
Jan 18 Javascript
html dom节点操作(获取/修改/添加或删除)
Jan 23 Javascript
JS判断客服QQ号在线还是离线状态的方法
Jan 13 Javascript
Js可拖拽放大的层拖动特效实现方法
Feb 25 Javascript
完美解决input[type=number]无法显示非数字字符的问题
Feb 28 Javascript
js for循环倒序输出数组元素的实例
Mar 01 Javascript
老生常谈angularjs中的$state.go
Apr 24 Javascript
Vue项目webpack打包部署到服务器的实例详解
Jul 17 Javascript
实例解析Vue.js下载方式及基本概念
May 11 Javascript
JS简单数组排序操作示例【sort方法】
May 17 Javascript
Vue+elementUI实现多图片上传与回显功能(含回显后继续上传或删除)
Mar 23 Javascript
微信小程序实现身份证取景框拍摄
Sep 09 Javascript
Angular2入门教程之模块和组件详解
May 28 #Javascript
关于Angular2 + node接口调试的解决方案
May 28 #Javascript
对象不支持indexOf属性或方法的解决方法(必看)
May 28 #Javascript
设置cookie指定时间失效(实例代码)
May 28 #Javascript
Mac系统下Webstorm快捷键整理大全
May 28 #Javascript
获取url中用&隔开的参数实例(分享)
May 28 #Javascript
Javarscript中模块(module)、加载(load)与捆绑(bundle)详解
May 28 #Javascript
You might like
php遍历目录viewDir函数
2009/12/15 PHP
详解php魔术方法(Magic methods)的使用方法
2016/02/14 PHP
php代码检查代理ip的有效性
2016/08/19 PHP
js Event对象的5种坐标
2011/09/12 Javascript
JavaScript设计模式学习之“类式继承”
2015/03/12 Javascript
Js与Jq 获取页面元素值的方法和差异对比
2015/04/30 Javascript
javascript加减乘除的简单实例
2016/07/12 Javascript
浅析JavaScript中作用域和作用域链
2016/12/06 Javascript
无阻塞加载js,防止因js加载不了影响页面显示的问题
2016/12/18 Javascript
从零学习node.js之详解异步控制工具async(八)
2017/02/27 Javascript
微信小程序左右滑动切换页面详解及实例代码
2017/02/28 Javascript
详解React之key的使用和实践
2018/09/29 Javascript
JavaScript判断浏览器运行环境的详细方法
2019/06/30 Javascript
JavaScript写个贪吃蛇小游戏(超详细)
2020/03/17 Javascript
Element Dialog对话框的使用示例
2020/07/26 Javascript
[03:40]DOTA2亚洲邀请赛小组赛第二日 赛事回顾
2015/01/31 DOTA
[02:28]DOTA2 2017国际邀请赛小组赛回顾
2017/08/09 DOTA
Python 自动安装 Rising 杀毒软件
2009/04/24 Python
python django事务transaction源码分析详解
2017/03/17 Python
关于Python中空格字符串处理的技巧总结
2017/08/10 Python
用Python和WordCloud绘制词云的实现方法(内附让字体清晰的秘笈)
2019/01/08 Python
Python元组常见操作示例
2019/02/19 Python
我们为什么要减少Python中循环的使用
2019/07/10 Python
tensorflow求导和梯度计算实例
2020/01/23 Python
Python数组拼接np.concatenate实现过程
2020/04/18 Python
Pandas中DataFrame交换列顺序的方法实现
2020/12/14 Python
美国在线打印网站:Overnight Prints
2018/10/11 全球购物
市场营销专业推荐信
2013/11/03 职场文书
办护照工作证明范本
2014/01/14 职场文书
2014年幼儿园元旦活动方案
2014/02/13 职场文书
聚美优品广告词改编
2014/03/14 职场文书
2015年高校辅导员工作总结
2015/04/20 职场文书
青年教师听课心得体会
2016/01/15 职场文书
经典励志格言:每日一句,让你每天充满能量
2019/08/16 职场文书
怎样写好演讲稿题目?
2019/08/21 职场文书
仅用几行Python代码就能复制她的U盘文件?
2021/06/26 Python