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

前言

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

效果图如下

方法如下

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

二、


注册一个模块 注入依赖

三、


返回不同的方法应对不同情况

四、


获取模板路径

五、


编写模板内容 和普通的页面一样调用使用angular服务

六、

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

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

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

七、


设置html代码内的变量

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

八、使用方法如下


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

九、使用效果

总结

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

赞 (0)

相关推荐

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

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

    前言 在编写一些大型工程的时候,会经常遇到一些公用提示,使用框架自带很多时候不方便,于是我手写了一个,下面来看看详细的介绍: 效果图如下 方法如下 一.先在angular中注册一个模块 二. 注册一个模块 注入依赖 三. 返回不同的方法应对不同情况 四. 获取模板路径 五. 编写模板内容 和普通的页面一样调用使用angular服务 六. 1. 开启http服务获取模板内容 2.  重点注意 $template = $compile(template)(scope); 这句代码非常重要  用于激活

  • 利用node.js搭建简单web服务器的方法教程

    前言 使用Nodejs搭建Web服务器是学习Node.js比较全面的入门教程,因为要完成一个简单的Web服务器,你需要学习Nodejs中几个比较重要的模块,比如:http协议模块.文件系统.url解析模块.路径解析模块.以及301重定向问题,下面我们就简单讲一下如何来搭建一个简单的Web服务器. 早先不使用web服务器的情况下想要在浏览器端访问本地资源,可以利用firefox浏览器,其可以自己启动一个小型web服务器. 为了让刚接触node的人也能大体看懂,本文的代码我将尽量简化. 准备 首先,

  • 利用Angular.js限制textarea输入的字数

    前言 大家可能都遇到过在输入的时候做出限制的需求,本文介绍的是通过Angular.js限制textarea输入字数的方法,有需要的朋友们可以参考以下实例. 实例代码如下 <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title>AngularJS 简单应用程序--输入字数限制</title> <!-- @author:sm @email:sm0

  • js实现右下角提示框的方法

    本文实例讲述了js实现右下角提示框的方法.分享给大家供大家参考.具体实现方法如下: 实现右下角提示框的Jquery插件 (popup.js) 复制代码 代码如下: //兼容ie6的fixed代码   //jQuery(function($j){  //    $j('#pop').positionFixed()  //})  (function($j){      $j.positionFixed = function(el){          $j(el).each(function(){ 

  • angular.js实现列表orderby排序的方法

    如下所示: <html ng-app> <head> <title>order by</title> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta name="viewport" content="width=device-width,initial-scale=1" /> &l

  • 利用C/C++编写node.js原生模块的方法教程

    利用C/C++编写node.js原生模块的方法教程

    前言 一直想了解一下使用C/C++编写nodejs原生模块,从网上找到的博客,大多都停留在如何搭建环境,然后一个Hello World完事.连更多的参考资料也没有.于是就自己整理了一下,分享于此. 至于准备环境什么的,网上一抓一大把,就不再详述 . 主要参考两个地方: nodejs官方文档 v8文档 其中第一个是nodejs的官方文档,里面介绍了几个不错的参考例子. 第二个是v8引擎的文档,c++的,编写c++模块主要看这个文档. 好了,我们开始几个例子,逐步的了解如何使用c++编写nodejs

  • 利用Node.js编写跨平台的spawn语句详解

    前言 Node.js 是跨平台的,也就是说它能运行在 Windows.OSX 和 Linux 平台上.很多 Node.js 开发者都是在 OSX 上做开发的,然后再将代码部署到 Linux 服务器上.由于 OSX 和 Linux 都是基于 Unix 的,因此两者共性很多.Windows 也是 Node.js 官方支持的平台,只要你通过正确的方式写代码,就能在各个平台上毫无压力的跑起来. Node.js 的子进程 (child_process) 模块下有一 spawn 函数,可以用于调用系统上的命

  • 浅谈angular.js中实现双向绑定的方法$watch $digest $apply

    Angular.js 中的特性,双向绑定. 多么神奇的功能,让视图的改变直接反应到数据中,数据的改变又实时的通知到视图,如何做到的? 这要归功于 scope 下面3个重要的方法: $watch $digest $apply 他们的区别是什么,我们来介绍下: $watch 这是一个监听 scope 上数据的监听器 方法说明: $scope.$watch('参数',function(newValue,oldValue){ //逻辑处理 }) 上面我们就是创建了一个监听器. '参数' 就是$scope

  • 利用ECharts.js画K线图的方法示例

    利用ECharts.js画K线图的方法示例

    前言 最近有一个统计的项目要做,在前端的数据需要用图表的形式展示.网上搜索了一下,发现有几种统计图库. MSChart 这个是Visual Studio里的自带控件,使用比较简单,不过数据这块需要在后台绑定. ichartjs 是一款基于HTML5的图形库.使用纯javascript语言, 利用HTML5的canvas标签绘制各式图形. 支持饼图.环形图.折线图.面积图.柱形图.条形图等. Chart.js 也是一款基于HTML5的图形库和ichartjs整体类似.不过Chart.js的教程文档

  • Ionic + Angular.js实现图片轮播的方法示例

    Ionic + Angular.js实现图片轮播的方法示例

    本文主要给大家介绍了关于Ionic + Angular实现图片轮播的相关资料,分享出来供大家参考学习,需要的朋友们下面来一起看看吧. 先来看看实现的效果图: 方法示例: template文件夹新建slider.html <ion-view view-title="图片轮播"> <ion-content class="padding" scroll="false"> <ion-slides class="sl

随机推荐