控制器信息传递的三种方式:
利用$rootScope
Angular JS中的作用域有一个非常有层次和嵌套分明的结构.其中她们都有一个主要的$rootScope然后其他所有的作用域部分都是继承自这个$rootScope的,或者说都是嵌套在主作用域下面的。
2.利用service服务
其中一个选择就是在应用程序作用域之中创建一个单例服务,然后通过这个服务处理所有子作用域的通信。
3.利用时间传播
事件传播的基本对象
<div ng-controller="parentController"> parentController <ul> <li ng-repeat="i in [1]" ng-controller="currentController"> <button ng-click="emitEvent()"> 事件向上传播 $emit('parentEvent') </button> <button ng-click="broadcastEvent()"> 事件向下传播 $broadcast('sonEvent') </button> <br> currentController <ul> <li ng-repeat="item in [1, 2]" ng-controller="sonController"> sonController </li> </ul> </li> </ul> </div>
*/ function parentController($scope) { // 注册事件的第一个参数是事件对象,第二个是事件传递的参数 $scope.$on('parentEvent', function(event,paramObj) { console.log("parentEvent"); console.dir(paramObj); }); } function currentController($scope) { // 注册事件的第一个参数是事件对象,第二个是事件传递的参数 $scope.$on('currentEvent', function(event,paramObj) { console.log("currentEvent"); console.dir(paramObj); }); // 触发在当前$scope的父亲$scope对象 $scope.emitEvent = function(){ var paramObj = { name : "wangyuyong", age : 22 }; $scope.$emit("parentEvent", paramObj); }; // 触发在当前$scope的子$scope对象 $scope.broadcastEvent = function(){ var paramObj = { name : "liumei", age : 23 }; $scope.$broadcast("sonEvent", paramObj); }; } function sonController($scope) { // 注册事件的第一个参数是事件对象,第二个是事件传递的参数 $scope.$on('sonEvent', function(event,paramObj) { console.log("sonEvent"); console.dir(paramObj); }); }
1、$emit 广播给父controller
2、$broadcast 是从发送者向他的子scope广播一个事件。
3、$emit 广播给父controller,父controller 是可以收到消息
4、$on 有两个参数function(event,msg) 第一个参数是事件对象,第二个参数是接收到消息信息.
相关推荐
AngularJS 事件驱动架构 AngularJS 事件驱动架构
带有拖放支持的日/周AngularJS事件日历/计划程序。 PHP和ASP.NET MVC后端。
主要介绍了Angularjs 事件指令详细整理的相关资料,这里对AngularJS 的所有的事件指令一一做出详细介绍,需要的朋友可以参考下
ng-仓库 v0.2.0 带有 AngularJS 事件的数据缓存。演示 angular . module ( 'demoApp' , [ 'data.warehouse' ] ) . controller ( 'DemoCtrl' , [ '$scope' , 'warehouse' , 'store2' , function ( $scope , warehouse...
主要介绍了AngularJS 事件发布机制,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
AngularJS 事件 AngularJS 有自己的 HTML 事件指令。 ng-click 指令 ng-click 指令定义了 AngularJS 点击事件。 AngularJS 实例 点我! {{ count }} 隐藏 HTML 元素 ng-hide 指令用于设置应用部分是否可见。...
angular-seed — AngularJS 应用程序的种子 这个项目是一个典型的 Web 应用程序的应用程序框架。 您可以使用它来快速引导您的 angular webapp 项目和这些项目的开发环境。 种子包含 AngularJS 库、测试库和一堆脚本...
Angular-echarts是 wangshijun对echarts利用Angular封装的组件,github地址https://github.com/wangshijun/angular-echarts。附件只是在源码例子里上添加了点击事件。
将json数据在网页上面显示出来,利用angularjs的点击事件ng-click
本文主要介绍AngularJS 事件,这里整理了相关资料,比较详细的介绍了AngularJS的使用方法,有需要的小伙伴参考下
├最新AngularJS开发宝典—第024讲 事件处理指令讲解.mp4 ├最新AngularJS开发宝典—第025讲 AngularJS+flex弹性盒模型+bootStrap 开发微信菜单前端之手机界面预览.mp4 ├最新AngularJS开发宝典—第026讲 AngularJS+...
本文主要介绍AngularJS 事件处理器,这里整理了相关资料和示例代码,有需要的小伙伴可以参考下
后半部分深入到 AngularJS 应用开发,系统地讨论了服务器通信、事件、架构、动画、本地化、安全、缓存、 移动应用等主题。 本书适合各个层次的 AngularJS 开发人员学习,无论是出于工作需要,还是好奇心的驱使,只要...
AngularJS 事件指令: ng-click/dblclick ng-mousedown/up ng-mouseenter/leave ng-mousemove/over/out ng-keydown/up/press ng-focus/blur ng-submit 和ng-click一样,都是给dom绑定事件的 需要注意的是,使用...
AngularJS权威教程是学习AngularJS的公认经典,内容全面,讲解通俗,适合...《AngularJS权威教程》后半部分深入到AngularJS应用开发,系统地讨论了服务器通信、事件、架构、动画、本地化、安全、缓存、移动应用等主题。
主要介绍了AngularJS实现动态添加Option的方法,涉及AngularJS事件响应及页面元素动态操作相关实现技巧,需要的朋友可以参考下
本书是学习 AngularJS 的公认经典,内容全面,讲解通俗,适合各层次的学习者。...本书 后半部分深入到 AngularJS 应用开发,系统地讨论了服务器通信、事件、架构、动画、本地化、安全、缓存、 移动应用等主题。
委托方法接受triggerEvents选项,该选项将某些回调作为 AngularJS 事件广播。 一个对象,它将 PubNub 频道无缝绑定到一个范围变量,该变量使用实时数据进行更新,并允许您通过专用方法与频道进行交互。 一个对象...