angularjs 编写公共提示模块

前言 在编写一些大型工程的时候 会经常遇到一些公用提示 使用框架自带很多时候不方便 于是我手写了一个 

  效果图如下 


angularjs 编写公共提示模块_第1张图片

1.先在angular中注册一个模块


2.

注册一个模块 注入依赖

3.


angularjs 编写公共提示模块_第2张图片
返回不同的方法应对不同情况 

4.

获取模板路径 


5. 

angularjs 编写公共提示模块_第3张图片
编写模板内容 和普通的页面一样调用使用angular服务

6.

angularjs 编写公共提示模块_第4张图片

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

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

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


7.



angularjs 编写公共提示模块_第5张图片
设置html代码内的变量

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

8.使用方法如下 


记得在控制器里面注入alertModel模块

9.使用效果 


angularjs 编写公共提示模块_第6张图片

你可能感兴趣的:(angularjs 编写公共提示模块)