由此例子我们可以看出,angularJS使用指令时link的执行顺序
<html>
<head>
<meta charset="utf-8"/>
<title></title>
</head>
<body ng-app="components">
<div>
<name xm>
<h1>小明</h1>
</name>
</div>
<div>
<name xm xmxh>
<h1>小明,小花</h1>
</name>
</div>
<div>
<name xm xmxh xmxhxl>
<h1>小明,小花,小龙</h1>
</name>
</div>
</body>
<script src="angular.js"></script>
<script>
var app= angular.module('components', []); app.directive("name",function(){
return {
restrict: "AE",
scope:{},
controller:function($scope){
$scope.name=[];
this.Xm=function(){
$scope.name.push("小明");
};
this.Xh=function(){
$scope.name.push("小花");
}
this.Xl=function(){
$scope.name.push("小龙");
}
},//controller中定义的方法和乘员可以通过link的第四个参数实现对外公布
link:function(scope, element, attr, superCtrl){
element.bind("click",function(){
alert(scope.name);
});
}
}
}); app.directive("xm",function(){
return {
require:"^name",
link:function(scope, element, attr, superCtrl){
superCtrl.Xm();
}
}
}); app.directive("xmxh",function(){
return {
require:"^name",
link:function(scope, element, attr, superCtrl){
superCtrl.Xh();
}
}
}); app.directive("xmxhxl",function(){
return {
require:"^name",
link:function(scope, element, attr, superCtrl){
superCtrl.Xl();
}
}
});
</script>
</html>

angularJS自定义指令间的“沟通”的更多相关文章

  1. AngularJs自定义指令详解(1) - restrict

    下面所有例子都使用angular-1.3.16.下载地址:http://cdn.bootcss.com/angular.js/1.3.16/angular.min.js 既然AngularJs快要发布 ...

  2. AngularJS: 自定义指令与控制器数据交互

    <!doctype html> <html> <head> <meta charset="utf-8"> <title> ...

  3. 浅析AngularJS自定义指令之嵌入(transclude)

    AngularJS自定义指令的嵌入功能与vue的插槽十分类似,都可以实现一些自定义内容展现.在开始之前先简单介绍下自定义指令的transclude属性和AngularJS的内置指令ng-transcl ...

  4. angularjs自定义指令Directive

    今天学习angularjs自定义指令Directive.Directive是一个非常棒的功能.可以实现我们自义的的功能方法. 下面的例子是演示用户在文本框输入的帐号是否为管理员的帐号"Adm ...

  5. angularJs 自定义指令传值---父级与子级之间的通信

    angularJs自定义指令用法我忽略,之前有写过,这里只说一下父子级之间如何传值: 例如: 模块我定义为myApp,index.html定义 <my-html bol-val="bo ...

  6. AngularJs自定义指令详解(6) - controller、require

    在前面文章中提到一旦声明了require,则链接函数具有第四个参数:controller. 可见require和controller是配合使用的. 在自定义指令中使用controller,目的往往是要 ...

  7. angularJs自定义指令.directive==类似自定义标签

    创建自定义的指令 除了 AngularJS 内置的指令外,我们还可以创建自定义指令. 你可以使用 .directive 函数来添加自定义的指令. 要调用自定义指令,HTML 元素上需要添加自定义指令名 ...

  8. angularJS——自定义指令

    主要介绍指令定义的选项配置 //angular指令的定义,myDirective ,使用驼峰命名法 angular.module('myApp', []) .directive('myDirectiv ...

  9. AngularJS自定义指令(Directives)在IE8下的一个坑

    在项目中,由于要兼容到IE8,我使用1.2.8版本的angularJS.这个版本是支持自定义指令的.我打算使用自定义指令将顶部的header从其他页面分离.也就是实现在需要header的页面只用在&l ...

随机推荐

  1. java学习点

    (1) spring mvc (2) java 多线程 (3) 链表 (4) mq (5) db2 (6)meaven (7) Mybitis

  2. iOS中iconfont(图标字体)的基本使用

    前言 近日在做项目时,项目组有提出iconfont的技术,便开始查询相关资料.iconfont技术的主要目的是为减少应用体积而生.首先icon代表图标 font代表字体.此技术便是将图标转化为字体,从 ...

  3. [译]JavaScript中,{}+{}等于多少?

    最近,Gary Bernhardt在一个简短的演讲视频“Wat”中指出了一个有趣的JavaScript怪癖:在把对象和数组混合相加时,会得到一些你意想不到的结果.本篇文章会依次讲解这些计算结果是如何得 ...

  4. Python单步调试

    运行 运行python -m pdb test.py (Pdb) 会自动停在第一行,等待调试,这时你可以看看帮助 (Pdb) h 几个关键命令 断点设置 (Pdb)b 10 #断点设置在本py的第10 ...

  5. eclipse debug URLClassPath.getLoader(int) file

    版权声明:本文为博主原创文章,未经博主允许不得转载. URLClassPath.getLoader 在用Eclipse调试Java程序时,新手遇到的一个问题是断点老是执行不到,弹出URLClassPa ...

  6. npm install 时报错 Unexpected end of input at 1:15930

    从github上clone代码后npm install,结果解决办法: npm config set registry https://registry.npm.taobao.org之后出现自动生成了 ...

  7. FFmpeg Android 学习(一):Android 如何调用 FFMPEG 编辑音视频

    一.概述 在Android开发中,我们对一些音视频的处理比较无力,特别是编辑音视频这部分.而且在Android上对视频编辑方面,几乎没有任何API做支持,MediaCodec(硬编码)也没有做支持.那 ...

  8. C#实现.Net对邮件进行DKIM签名和验证,支持附件,发送邮件签名后直接投递到对方服务器(无需己方邮件服务器)

    项目地址 https://github.com/xiangyuecn/DKIM-Smtp-csharp 主要支持 对邮件进行DKIM签名,支持带附件 对整个邮件内容(.eml文件)的DKIM签名进行验 ...

  9. Miller_Rabin 素数测试

    费马定理的逆定理几乎可以用来判断一个数是否为素数,但是有一些数是判断不出来的,因此,Miller_Rabin测试方法对费马的测试过程做了改进,克服其存在的问题. 推理过程如下(摘自维基百科): 摘自另 ...

  10. 使用 RamMap 清理内存 How to Use RamMap to Empty System Working Set

    使用 RamMap 清理内存 In this post I want to introduce RamMap by Microsoft. It’s a free tool you can use to ...