利用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 相关文章推荐
JavaScript Base64编码和解码,实现URL参数传递。
Sep 18 Javascript
Javascript操纵Cookie实现购物车程序
Feb 15 Javascript
JavaScript表达式:URL 协议介绍
Mar 10 Javascript
jQuery中position()方法用法实例
Jan 16 Javascript
JS版元素周期表实现方法
Aug 05 Javascript
JavaScript仿百度图片浏览效果
Nov 23 Javascript
深入理解ES6的迭代器与生成器
Aug 19 Javascript
Node.js使用cookie保持登录的方法
May 11 Javascript
Vue+Express实现登录状态权限验证的示例代码
May 05 Javascript
vue视图不更新情况详解
May 16 Javascript
React-vscode使用jsx语法的问题及解决方法
Jun 21 Javascript
vue使用localStorage持久性存储实现评论列表
Apr 14 Vue.js
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字符串函数学习之substr()
2015/03/27 PHP
PHP PDOStatement::fetchAll讲解
2019/01/31 PHP
Laravel 错误提示本地化的实现
2019/10/22 PHP
JavaScript入门教程(6) Window窗口对象
2009/01/31 Javascript
JavaScript严格模式禁用With语句的原因
2014/10/20 Javascript
JavaScript事件委托技术实例分析
2015/02/06 Javascript
Bootstrap打造一个左侧折叠菜单的系统模板(二)
2016/05/17 Javascript
关于JSON与JSONP简单总结
2016/08/16 Javascript
vue.js表格分页示例
2016/10/18 Javascript
火狐和ie下获取javascript 获取event的方法(推荐)
2016/11/26 Javascript
JavaScript实现form表单的多文件上传
2020/03/27 Javascript
浅谈Emergence.js 检测元素可见性的 js 插件
2017/11/18 Javascript
利用vue和element-ui设置表格内容分页的实例
2018/03/02 Javascript
jQuery length 和 size()区别总结
2018/04/26 jQuery
JS实现自定义弹窗功能
2018/08/08 Javascript
基于vue中对鼠标划过事件的处理方式详解
2018/08/22 Javascript
Vue-router 切换组件页面时进入进出动画方法
2018/09/01 Javascript
vue axios封装及API统一管理的方法
2019/04/18 Javascript
利用es6 new.target来对模拟抽象类的方法
2019/05/10 Javascript
vue 路由守卫(导航守卫)及其具体使用
2020/02/25 Javascript
在Vue.js中使用TypeScript的方法
2020/03/19 Javascript
在vue中实现清除echarts上次保留的数据(亲测有效)
2020/09/09 Javascript
[01:11:02]Secret vs Newbee 2019国际邀请赛小组赛 BO2 第一场 8.15
2019/08/17 DOTA
python 截取 取出一部分的字符串方法
2017/03/01 Python
Python中将dataframe转换为字典的实例
2018/04/13 Python
python调用java的jar包方法
2018/12/15 Python
python实现诗歌游戏(类继承)
2019/02/26 Python
python实现QQ批量登录功能
2019/06/19 Python
pytorch 求网络模型参数实例
2019/12/30 Python
python实现飞船大战
2020/04/24 Python
Ootori在线按摩椅店:一家专业的按摩椅制造商
2019/04/10 全球购物
保送生自荐信范文
2013/10/06 职场文书
弘扬雷锋精神活动演讲稿
2014/03/04 职场文书
商业项目策划方案
2014/06/05 职场文书
违反交通法规检讨书
2014/09/10 职场文书
探究Mysql模糊查询是否区分大小写
2021/06/11 MySQL