通过$broadcast或$emit在controller之间进行值传递,不过这些controller必须是子级或者父级关系,
$emit只能向父级parent controller传递事件event与数据data,$broadcast只能向子级child controller传递event与data,$on用于接收event与data.
<script>
var myapp=angular.module('myapp',[]);
myapp.controller('SelfCtrl', function($scope) {
$scope.click = function () {
$scope.$emit('to-parent', 'parent');
$scope.$broadcast('to-child', 'child');
}
});//在当前控制器内,分别给父级控制器和子级控制器传递事件和数据 myapp.controller('ParentCtrl', function($scope) {
$scope.$on('to-parent', function(d,data) {
console.log(data); //父级控制器内监听上面控制器中$emit注册的事件和传递的值
});
$scope.$on('to-child', function(d,data) {
console.log(data); //父级控制器内监听不到上面控制器中$broadcast注册的事件和传递的值,因为$broadcast注册的事件和传递的值是给子级的控制器的
});
}); myapp.controller('ChildCtrl', function($scope){
$scope.$on('to-child', function(d,data) {
console.log(data); //同理
});
$scope.$on('to-parent', function(d,data) {
console.log(data); //同理
});
}); myapp.controller('BroCtrl', function($scope){
$scope.$on('to-parent', function(d,data) {
console.log(data); //平级得不到值,因为$broadcast或$emit只能给子级或父级controller传递事件和值
});
$scope.$on('to-child', function(d,data) {
console.log(data); //同理
});
}); </script> <body ng-app="myapp">
<div ng-controller="ParentCtrl"> //父级控制器
<div ng-controller="SelfCtrl"> //当前控制器
<a ng-click="click()">click me</a>
<div ng-controller="ChildCtrl"></div> //子级控制器
</div> <div ng-controller="BroCtrl"></div> //平级控制器
</div>
</body>

原文:http://blog.51yip.com/jsjquery/1602.html

通过$broadcast或$emit在子级和父级controller之间进行值传递的更多相关文章

  1. Vue父子组件通信(父级向子级传递数据、子级向父级传递数据、Vue父子组件存储到data数据的访问)

    Vue父子组件通信(父级向子级传递数据.子级向父级传递数据.Vue父子组件存储到data数据的访问) 一.父级向子级传递数据[Prop]: ● Prop:子组件在自身标签上,使用自定义的属性来接收外界 ...

  2. Flutter路由跳转父级页面向子页面传参及子页面向父级页面传参

    Flutter中页面通过路由跳转传参主要分两种,一种是通过push()跳转时根据设定的参数进行传参,另一种是通过pop()返回时进行传参. 父级页面向子页面push()传参 假设从A页面跳到B页面可能 ...

  3. Vue中利用$emit实现子组件向父组件通信

    Vue中利用$emit实现子组件向父组件通信 父组件 <template> <div> <p>我是父组件</p> <child :isShow=& ...

  4. Vue点到子路由,父级,无法高亮问题解决

    [问题] Vue点到子路由,父级,无法高亮 [原因]多是因为链接简写相对路径没有写完整导致 [解决]把子路由的router-link的to属性里链接写完整.并把router配置文件里path也写完整即 ...

  5. 递归方式---通过子级id,获取子级和父级Name

    #region 递归--返回 父级|子级 名称 #region --返回 父级|子级 名称 public string RetrurnTypeNames(string TypeId) { String ...

  6. angularjs $broadcast $emit $on 事件触发controller间的值传递

    如何在作用域之间通信呢? 1.创建一个单例服务,然后通过这个服务处理所有子作用域的通信. 2.通过作用域中的事件处理通信.但是这种方法有一些限制:例如,你并不能广泛的将事件传播到所有监控的作用域中.你 ...

  7. Angular中Controller之间的信息传递(第二种办法):$emit,$broadcast,$on

    $emit只能向parent controller传递event与data( $emit(name, args) ) $broadcast只能向child controller传递event与data ...

  8. Thinkcmf子栏目获取父级栏目所有子栏目列表

    网站建设时经常需要输出某个栏目的子栏目,对应的在子栏目列表页也需要输出父级栏目的子栏目列表,thinkcmf可以输出所有子栏目,但却无法在子栏目列表页也适用, 因此就需要通过对数据库表查询来完成需求: ...

  9. php 无线分类 根据子级找父级

    public function transform($item){ //查询数据 $position = AdminAccess::where('id',$item)->first(); $re ...

随机推荐

  1. Spark思维导图之Shuffle

  2. 使用flask_socketio实现客户端间即时通信

    前期没有来得及好好总结,现在复习总结一下: Socket.IO 背后主要的思想是你可以发送和接收想要的任何事件,携带你想要的任何数据.任何可以编码为 JSON 的对象都可以做到,并且也支持二进制数据. ...

  3. linux 如何保持兼容性

    参考链接:   https://www.cnblogs.com/MYSQLZOUQI/p/5383594.html

  4. JS调用函数时候加括号与只写函数名字的区别 fn与fn()的区别

    经常见插件里面函数调用的时候只写个函数名字,不写函数参数,甚至连括号也不写,比如说: <!DOCTYPE html> <html> <head> <meta ...

  5. P3168 [CQOI2015]任务查询系统

    题目地址:P3168 [CQOI2015]任务查询系统 主席树的模板题 更模板的在这儿:P3834 [模板]可持久化线段树 1(主席树) 形象的说,P3834是"单点修改,区间查询" ...

  6. Spring Security测试代码

    ⒈实体Bean package cn.coreqi.blog.entities; import org.springframework.security.core.GrantedAuthority; ...

  7. QML 从入门到放弃

    发现了一个问题: QQuickView only supports loading of root objects that derive from QQuickItem. If your examp ...

  8. python中常用模块

    OS模块 python编程时,经常和文件.目录打交道,这是就离不了os模块.os模块包含普遍的操作系统功能,与具体的平台无关os.name()——判断现在正在实用的平台,Windows 返回 ‘nt' ...

  9. NLog类库使用探索——详解配置

    1 配置文件的位置(Configuration file locations) 通过在启动的时候对一些常用目录的扫描,NLog会尝试使用找到的配置信息进行自动的自我配置. 1.1 单独的*.exe客户 ...

  10. powerdesigner 使用技巧 建模工具 导出sql 导出实体类 导出word

    显示comment列 Table Properties(表属性)=>Columns(列)=>Customize Columns and Filter(自定义列过滤) 勾上 comment ...