AngularJS中指令的四种基本形式实例分析_AngularJS

本文实例讲述了AngularJS中指令的四种基本形式。分享给大家供大家参考,具体如下:

指令的四种基本形式中,

注意注释型指令 M 的使用方法是 <!--  directive:指令名称  --> 注意左右俩测必须有空格才会正常识别

所有指令是可以相互组合 的,不写restrict ,将会默认为A属性 指令要支持IE8 浏览器 一般最好将指令设置为属性

<!doctype html>
<html ng-app="myapp">
  <head>
    <meta charset="utf-8"/>
  </head>
  <body>
    <elementtag>E</elementtag>
    <div attr>A</div>
    <div class="classnamw">C</div>
    <!-- 注意注释变量两侧必须加上空格 否则不会正确执行这个指令 -->
    <!-- directive:commit -->
    <div></div>
  <script src="./js/angular.min.js"></script>
  <script>
    var app = angular.module('myapp',[]);
    app.directive('elementtag',function(){
      return {
        restrict:"E", //元素指令
        link:function(scope,element,attrs){
          console.log("this is a element");
        }
      };
    })
    .directive('attr',function(){
      return {
        restrict:"A", //属性指令
        link:function(scope,element,attrs){
          console.log("this is a attribute");
        }
      };
    })
    .directive('classnamw',function(){
      return {
        restrict:"C", //class 指令
        link:function(scope,element,attrs){
          console.log("this is a class");
        }
      };
    })
    .directive('commit',function(){
      return {
        restrict:"M", //注释指令
        link:function(scope,element,attrs){
          console.log("this is a commit");
        }
      };
    });
  </script>
</html>

希望本文所述对大家AngularJS程序设计有所帮助。

以上是小编为您精心准备的的内容,在的博客、问答、公众号、人物、课程等栏目也有的相关内容,欢迎继续使用右上角搜索按钮进行搜索angularjs
, 指令
基本形式
angularjs 指令、angularjs 指令详解、angularjs 自定义指令、angularjs 项目实例、angularjs小项目实例,以便于您获取更多的相关知识。

时间: 2024-10-31 12:06:05

AngularJS中指令的四种基本形式实例分析_AngularJS的相关文章

AngularJS中的Promise详细介绍及实例代码_AngularJS

Angular中的Promise 在用jQuery的时候就知道 promise 是 Js异步编程模式的一种模式,但是不是很明白他跟JQuery的deferred对象有什么区别.随着公司项目的进行,要跟后台接数据了,所以决定搞定它. Promise Promise是一种模式,以同步操作的流程形式来操作异步事件,避免了层层嵌套,可以链式操作异步事件. 我们知道,在编写JavaScript异步代码时,callback是最最简单的机制,可是用这种机制的话必须牺牲控制流.异常处理和函数语义化为代价,甚至会

javascript实现html页面之间参数传递的四种方法实例分析_javascript技巧

本文实例讲述了javascript实现html页面之间参数传递的四种方法.分享给大家供大家参考,具体如下: 我们知道,在服务器端asp,jsp等程序可以接受html页面上的form传来的参数.那么,可不可以传递参数给html页面呢.可以. 原理:通过window.location.href中的分割符获得各个参数 方法一: /* *函数功能:从href获得参数 *sHref: http://www.cscenter.com.cn/arg.htm?arg1=d&arg2=re *sArgName:a

Python中逗号的三种作用实例分析

  本文实例讲述了Python中逗号的三种作用.分享给大家供大家参考.具体分析如下: 最近研究python 遇到个逗号的问题 一直没弄明白 今天总算搞清楚了 1.逗号在参数传递中的使用: 这种情况不多说 没有什么不解的地方 就是形参或者实参传递的时候参数之间的逗号 例如def abc(a,b)或者abc(1,2) 2.逗号在类型转化中的使用 主要是元组的转换 例如: ? 1 2 3 4 5 6 7 8 9 10 11 12 13 >>> a=11 >>> b=(a) &

Android 常见的四种对话框实例讲解_Android

1.对话框通知(Dialog Notification) 当你的应用需要显示一个进度条或需要用户对信息进行确认时,可以使用对话框来完成. 下面代码将打开一个如图所示的对话框: public void click1(View view) { AlertDialog.Builder builder = new Builder(this); builder.setTitle("工学1号馆"); builder.setIcon(R.drawable.ic_launcher); builder.

简单介绍Android中Activity的四种启动模式_Android

在Android中每个界面都是一个Activity,切换界面操作其实是多个不同Activity之间的实例化操作.在Android中Activity的启动模式决定了Activity的启动运行方式. Activity有四种启动模式: 1. standard,默认的启动模式,只要激活Activity,就会创建一个新的实例,并放入任务栈中,这样任务栈中可能同时有一个Activity的多个实例. 2. singleTop,激活Activity时,如果栈顶是这个Activity,就不会创建新的实例:如果栈顶

Android 常见的四种对话框实例讲解

1.对话框通知(Dialog Notification) 当你的应用需要显示一个进度条或需要用户对信息进行确认时,可以使用对话框来完成. 下面代码将打开一个如图所示的对话框: public void click1(View view) { AlertDialog.Builder builder = new Builder(this); builder.setTitle("工学1号馆"); builder.setIcon(R.drawable.ic_launcher); builder.

Android编程中Activity的四种启动模式

本文实例讲述了Android编程中Activity的四种启动模式.分享给大家供大家参考,具体如下: Activity启动方式有四种,分别是: standard singleTop singleTask singleInstance 可以根据实际的需求为Activity设置对应的启动模式,从而可以避免创建大量重复的Activity等问题. 设置Activity的启动模式,只需要在AndroidManifest.xml里对应的<activity>标签设置android:launchMode属性,例

简单介绍Android中Activity的四种启动模式

在Android中每个界面都是一个Activity,切换界面操作其实是多个不同Activity之间的实例化操作.在Android中Activity的启动模式决定了Activity的启动运行方式. Activity有四种启动模式: 1. standard,默认的启动模式,只要激活Activity,就会创建一个新的实例,并放入任务栈中,这样任务栈中可能同时有一个Activity的多个实例. 2. singleTop,激活Activity时,如果栈顶是这个Activity,就不会创建新的实例:如果栈顶

Javascript中call的两种用法实例

 这篇文章主要介绍了Javascript中call的两种用法实例,有需要的朋友可以参考一下 用法一(常见用法):   表现形式为:一个对象.方法.call(另一个对象),意义是用另一个对象代替当前对象,执行当前对象的方法.先看示例:  代码如下: function Class1(){     this.name = "class1";     this.showName = function(){         alert(this.name);     } } function C