/**
* Created by Administrator on 2017/8/28.
*/
var app =angular.module('app',[]);
app.directive('food',function () {
return {
restrict:"E",
scope:[],
controller:function($scope){
$scope.foods=[];
this.addApple=function () {
$scope.foods.push("apple");
}
this.addOrange=function () {
$scope.foods.push("orange");
}
this.addBanana=function () {
$scope.foods.push("banana");
}
},
link:function ($scope,element,attrs) {
element.bind("mouseenter",function () {
console.log($scope.foods)
});
}
}
});
app.directive('apple',function () {
return {
require:'food',
link:function($scope,element,attrs,foodCtrl){
foodCtrl.addApple();
}
}
});
app.directive('orange',function () {
return {
require:'food',
link:function($scope,element,attrs,foodCtrl){
foodCtrl.addOrange();
}
}
});
app.directive('banana',function () {
return {
require:'food',
link:function($scope,element,attrs,foodCtrl){
foodCtrl.addBanana();
}
}
}); app.directive('hello',function(){
return {
restrict:"E",
replace:true,
template:'<div><input type="text" ng-model="txt"/><div>{{txt}}</div></div>',
link:function($scope,element,attrs){
$scope.$watch('txt',function(newVal,oldVal){
if(newVal==="error"){
console.dir(element);
element.attr("style","border:solid 1px red");
}else{
element.attr("style","");
}
});
}
}
}); app.controller('OneSelfController',function($scope){
$scope.clkme=function(){
$scope.$broadcast('sendChild','我给子控制器传递数据');
$scope.$emit('sendParent','冒泡到父元素')
}
}).controller('ParentController',function($scope){
$scope.$on('sendParent',function(event,data){//监听在子控制器中定义的 sendParent 事件
console.log('OneSelfController传过来的',data,event.name,event);//事件名称:sendParent
});
$scope.clkP=function(){
$scope.$broadcast('sendAllChild','让siblingsController接收到');
} }).controller('ChildController', function($scope){
$scope.$on('sendChild', function(event,data) {//监听在子控制器中定义的 sendChild 事件
console.log('ChildCtrl', data,event.name,event);// 事件名称:sendChild
});
}).controller('siblingsController', function($scope){
$scope.$on('sendAllChild',function(event,data) {
console.log('值过来吧', data);
});
//下面事件不会触发
$scope.$on('sendParent', function(event,data) {
console.log('平级得不到值', data);
});
$scope.$on('sendChild', function(event,data) {
console.log('平级得不到值', data);
});
});

  

angular controller与directive相互引用的更多相关文章

  1. angularjs取Sevice和directive的引用

    取Sevice和directive的引用 3: Grab any Services We can grab a reference to any service using the injector  ...

  2. AngularJS + ui-router + RequireJS异步加载注册controller/directive/filter/service

    一般情况下我们会将项目所用到的controller/directive/filter/sercive预先加载完再初始化AngularJS模块,但是当项目比较复杂的情况下,应该是打开对应的界面才加载对应 ...

  3. Angular 下的 directive (part 2)

    ngCloak ngCloak指令被使用在,阻止angular模板从浏览器加载的时候出现闪烁的时候.使用它可以避免闪烁问题的出现.   该指令可以应用于<body>元素,但首选使用多个ng ...

  4. angular Creating a Directive that Adds Event Listeners

    <span my-draggable>Drag ME</span> angular.module('dragModule', []) .directive('myDraggab ...

  5. C语言中结构体 自引用 和 相互引用

    http://blog.163.com/modingfa_002/blog/static/11092546620133193264579 结构体的自引用(self reference),就是在结构体内 ...

  6. css笔记14:css文件之间可以相互引用

    css文件之间相互引用是通过@import指令完成的 格式: @import  url("被引用的css文件"); 顺便说一句,如果希望在html或者php文件中引用某个xxx.c ...

  7. 《how to design programs》15章 相互引用的数据定义

    由结构体组成的表与结构体中的表. 在用追溯形式建立家家谱树时,我们通常从某个后代除法,依次处理它的父母,组父母等.而构建树时,我们会不断添加谁是谁的孩子,而不是写出谁是谁的父母,从而建立一颗后代家谱树 ...

  8. Cocos Creator两个类相互引用(调用)

    如果两个类相互引用,脚本加载阶段就会出现循环引用,循环引用将导致脚本加载出错:///////////Game.jsvar Item = require("Item");var Ga ...

  9. C++类间相互引用

    两个类相互包含引用的问题 不管是下文中提到的例子,还是任何情况,使得class A的头文件需要include class B的头文件,class B的也要引用A的头文件,这种状况下,貌似会出现有一个类 ...

随机推荐

  1. D. Caesar's Legions 背包Dp 递推DP

    http://codeforces.com/problemset/problem/118/D 设dp[i][j][k1][k2] 表示,放了i个1,放了j个2,而且1的连续个数是k1,2的连续个数是k ...

  2. memcache学习

    1.memcache和memcached区别 Memcache是该系统的项目名称,Memcached是该系统的主程序文件(字母d可以理解为daemon),以守护程序方式运行于一个或多个服务器中,随时接 ...

  3. visio双屏幕打开

    开始以为visio2010好像不可以 但我以前用的visio2007貌似可以 但 不想换回去了 适应了就好 后来找到大牛级认为 解决了 如下:我用的2010,按照下面修改绝对可以.1. 打开Visio ...

  4. Redis的下载安装

    Redis官网只提供了Linux版,MicroSoft自己搞了个Windows版,可在GitHub下载: https://github.com/microsoftarchive/redis/relea ...

  5. [Python]输出中文报错的解决方法

    问题现象:在PyCharm工具编辑python语句输出中文时,程序报错. 解决方法(2种): 1.在代码开头加#coding=utf-8(注意要加#) 2.还是在代码开头加#-*- coding: u ...

  6. ios UnitTest 学习笔记1

    一.运行第一个单元测试: 1.在Xcode 5中新建一个工程默认自带一个单元测试的文件夹,IDE自动生成了一个实现XCTestCase的.m文件,里面有一个失败测试(早期版本中实现的是SenTestC ...

  7. Matplotlib_常用图表

    Matplotlib绘图一般用于数据可视化 1.常用的图表有: 折线图(坐标系图) 散点图/气泡图 条形图/柱状图 饼图 直方图 箱线图 热力图 折线图(坐标系图) 折线图用于显示随时间或有序类别的变 ...

  8. 爬虫_python3_urllib

    urlib库为python3的HTTP内置请求库 urilib的四个模块: urllib.request:用于获取网页的响应内容 urllib.error:异常处理模块,用于处理异常的模块 urlli ...

  9. Electric Motor Manufacturer - Motor Protection: 5 Questions, 5 Answers

    I. Selection principle of motor protectorThe  Electric Motor Manufacturer   stated that the reasonab ...

  10. springboot上传linux文件无法浏览,提示404错误

    1.配置文件地址置换 @Componentclass WebConfigurer implements WebMvcConfigurer { @Autowired ConfigUtil bootdoC ...