AngularJS的学习--$on、$emit和$broadcast的使用

最新推荐文章于 2025-12-06 22:12:52 发布
转载 最新推荐文章于 2025-12-06 22:12:52 发布 · 750 阅读 · 0
文章标签：

#angularjs #html5

本文深入探讨了Angular和Vue作为现代前端框架在构建单页面应用时的功能、特性和最佳实践，旨在帮助开发者选择最适合项目的框架。文章通过对比两者的核心概念、组件体系、依赖管理、路由策略等关键方面，为读者提供了一个全面的视角来评估和决策。

转载于：去围观


  • $emit只能向parent controller传递event与data
  • $broadcast只能向child controller传递event与data
  • $on用于接收event与data

例子如下:...


Angular $scope和$rootScope事件机制之$emit、$broadcast和$on
无声告白
06-29 1万+
Angular按照发布/订阅模式设计了其事件系统，使用时需要“发布”事件，并在适当的位置“订阅”或“退订”事件，就像邮箱里面大量的订阅邮件一样，当我们不需要时就可以将其退订了。具体到开发中，对应着$scope和$rootScope的$emit、$broadcast和$on方法。本文介绍Angular的事件机制，
angularjs $emit $broadcast $on 通讯
guyatao13的专栏
05-22 785
$emit只能向parent controller传递event与data$broadcast只能向child controller传递event与data$on用于接收event与data 例子如下 html代码 div ng-controller="ParentCtrl"> 父级--> div ng-controller="SelfCtrl"
$on、$emit和$broadcast的使用
weixin_30892763的博客
09-30 139
$emit只能向parent controller传递event与data( $emit(name, args) ) $broadcast只能向child controller传递event与data( $broadcast(name, args) ) $on用于接收event与data( $on(name, listener) ) <div ng-controlle...
angular中$emit与$broadcast详解
在路上
05-28 9499
angularjs 中 broadcast与broadcast 与 emit $on的处理思想 对于Angular的controll之间的通信方式，我们可以常见有有几种方式，如可以通过rootScope，还有通过rootScope，还有通过scope的作用域，当然还有一种个人觉得很好的通信方式就是broadcast,broadcast,emit,$on来监听； broadcast方式与broadc
angualrJS中$broadcast,$emit,$on的用法
qq_36414265的博客
07-13 545
$scope.$broadcast('toDown', '传值'); 向下广播事件toDown，比如该语句定义在控制器里，位于此以下作用域都可以收到，例如控制器的指令和子控制器，所传的参数可以是引起来的字符串，也可以是是一个对象。$scope.$on("toDown", function(even, data) { //do something ...
Vue中的情侣属性$dispatch和$broadcast详解
infotw的博客
06-10 3907
$dispatch 和 $broadcast 作为一对情侣
AngularJS $on、$emit和$broadcast的使用
10-21
2. 使用$on、$emit和$broadcast方法：AngularJS通过事件系统提供了一种在作用域之间通信的方式，这种方法不需要手动管理服务。 - $emit方法用于从当前作用域向上冒泡事件到父作用域。当你在子作用域中调用$scope.$...
Angularjs中的事件广播 —全面解析$broadcast,$emit,$on
10-22
AngularJS提供了一些内置的服务和方法来实现事件的广播和监听，包括$broadcast、$emit和$on。本篇文章将全面解析这三个方法的用法和功能。 首先，我们来看$broadcast方法。$broadcast方法用于将事件从父级作用域向...
Angular中$broadcast和$emit的使用方法
热门推荐
justforuse的博客
08-21 3万+
要在控制器之间传递变量变化需要使用angular中的$broadcast和$emit方法来传递，同时使用$on来接收事件并作出响应。broadcast译为广播，即上级传递下级。 示例代码： <script src="../angular.js"></script> <script> angular.module("app", []) .controller("child", functio
微信小程序Wepy框架的三个事件交互($broadcast，$emit，$invoke)
weixin_30296405的博客
06-28 297
$broadcast： $broadcast事件是由父组件发起，所有子组件都会收到此广播事件，除非事件被手动取消。事件广播的顺序为广度优先搜索顺序，如上图，如果页面Page_Index发起一个$broadcast事件，那么按先后顺序依次接收到该事件的组件为：ComA、ComB、ComC、ComD、ComE、ComF、ComG、ComH。如下图 理解官方意...
Vue.js 2.0 中#$on与$emit如何使用之实例讲解
似码非码的博客
11-20 1万+
先对两个方法来一波解释vm.$on(event,callback)参数： {string | Array} event (数组只在 2.2.0+ 中支持) {Function} callback用法： 监听当前实例上的自定义事件。事件可以由vm.$emit触发。回调函数会接收所有传入事件触发函数的额外参数。示例：vm.$on('test', function (msg) { consol
子组件向父传参 .$emit的使用
qq_30944053的博客
04-01 297
案例背景：子组件是一个弹出层，点击父组件显示弹出层，子组件按钮控制弹出层的隐藏 父组件： @closeAddress="closeList" 关闭联系人弹框* @showName="linkName" 获取子组件选中的联系人*<address-list v-show="addressShow" @closeAddress="closeList" @showName="linkName"...
理解angularjs中的$emit,$broadcast和$on
Four的博客
08-04 1万+
在angularjs中提供了emit,emit,broadcast和$on服务用于控制器之间基础事件的传递交流。 1、$emit 该服务贯穿作用域发出一个向上的事件，并通知哪些注册在rootScope.Scope上的监听器。该事件的生命周期开始于rootScope.Scope上的监听器。该事件的生命周期开始于emit被启动的地方，事件一直朝着根作用域传递，传递期间并通知哪些注册在作用域上的监听器
AngularJS中$scope用法
jspshuishui的专栏
07-15 1459
​$scope 的使用贯穿整个 Angular App 应用,它与数据模型相关联,同时也是表达式执行的上下文. $scope 的使用贯穿整个 Angular App 应用,它与数据模型相关联,同时也是表达式执行的上下文.有了 $scope 就在视图和控制器之间建立了一个通道,基于作用域视图在修改数据时会立刻更新 $scope,同样的 $scope 发生改变时也会立刻重新渲染视图.  
angularjs $broadcast 和 $on 的使用及其注意事项
Four的博客
08-04 1万+
在同一页面时候，一般会有不同的ctr控制不同的模块，那么要在不同的ctr之间传递事件就需要用到 broadcast和broadcast 和on来传播和接收事件 下面是demo：<div ng-controller="ParentCtrl"> www.111cn.net //父级 <div ng-controller="SelfCtrl">
表单数据验证：HTML5 自带属性与其他方法的结合应用
你若盛开，清风自来
12-06 447
本文介绍了表单数据验证的多种方法，包括HTML5自带验证属性、JavaScript验证和后端验证。HTML5提供了required、pattern、min/max等基础验证功能，但存在验证逻辑简单、无法异步验证等局限性。JavaScript可通过事件监听、ValidityState API或第三方库实现更复杂的验证逻辑。后端验证作为最后防线，使用服务器语言确保数据安全。开发者应根据需求选择合适的验证组合，构建健壮的表单验证机制。
HTML5 + 原生 CSS + 原生 JS 网页实现攻略
最新发布
hy行者勇哥的博客
12-06 905
整个过程就像「搭积木 + 装修 + 装玩具」，我们不用自己设计积木形状（HTML 代码现成），不用自己想装修风格（CSS 代码现成），不用自己做玩具（JS 代码现成），只需要按步骤 “拼起来、换自己的图案”，就能完成一个专业网页！：图片命名要和代码里的一致（比如 banner.jpg、team-1.jpg），如果图片尺寸不一样，网页会自动适配，不用手动调整大小～：这一步就像给房子刷墙、定家具位置，代码里已经写好了 “墙要刷白色、标题要加粗、按钮要蓝色”，我们直接用现成的 “装修方案”～
深入理解AngularJS：Controller与$scope作用域详解
这可能涉及到控制器间的通信，如使用事件（$emit, $broadcast, $on），服务（Service）的注入，或者共享数据的方法。同时，这也会深入讨论AngularJS的模块化和组件化的理念，帮助开发者更好地组织和管理应用的结构。...
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
表情包 代码片
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值