夺命雷公狗—angularjs—18—angularjs的事件
2016-08-20 15:39
387 查看
对于一款前端框架,提起事件,很容易让人联想到DOM事件,比如说鼠标点击以及页面滚动等。但是我们这里说的angular中的事件和DOM事件并不是一个东西。
以及 $broadcast() 来发布事件
args 会作为对象传递到事件的监听器中
$emit() 发布的事件,会从子作用域冒泡到父作用域,产生事件的作用域之上的所有作用域都会收到这个事件的通知。
可以通过 $on() 方法来注册事件监听事件。
$on() 返回一个反注册函数,可以用其来取消监听器。
targetScope 作用域对象,发送事件的作用域
currentScope :当前处理事件的作用域
name: 当前事件的事件的名称
stopPropagation: 取消$emit触发的事件进一步的传播
preventDefaul: 把defaultPreevented标志设置为true,告诉子作用域可以无需处理该事件。
defaultPreevented:布尔值
angular: 内置事件
$includeContentLoaded($emit事件)
ngInclude内容重新加载的时候,从ngInclude指令触发
事件的发布
我们可以通过 $emit()以及 $broadcast() 来发布事件
$emit(name, args)
name 发布的事件名称args 会作为对象传递到事件的监听器中
$emit() 发布的事件,会从子作用域冒泡到父作用域,产生事件的作用域之上的所有作用域都会收到这个事件的通知。
$broadcast(name, args)
同 $emit 的参数一直,name 作为事件的名字,args 作为监听器接受 的参数。使用该方法事件的传播方向是从上至下,即从父作用域到子作用域。事件的监听
事件发布了,我们要注册监听事件的服务,才会对事件进行响应可以通过 $on() 方法来注册事件监听事件。
$scope.$on(name, listenerFn)
当以 name 为事件名的事件被促发之后,listenerFn 事件就会被执行。$on() 返回一个反注册函数,可以用其来取消监听器。
事件对象
所有的事件监听器第一个参数都代表了事件对象,该对象有以下属性:targetScope 作用域对象,发送事件的作用域
currentScope :当前处理事件的作用域
name: 当前事件的事件的名称
stopPropagation: 取消$emit触发的事件进一步的传播
preventDefaul: 把defaultPreevented标志设置为true,告诉子作用域可以无需处理该事件。
defaultPreevented:布尔值
angular: 内置事件
$includeContentLoaded($emit事件)
ngInclude内容重新加载的时候,从ngInclude指令触发
$includeContentRequested($emit事件)
从调用ngInclude的作用域上发送,每次ngInclude的内容被请求的时候,都会发布该事件$viewContentLoaded($emit事件)
当ngView内容被重新加载时,从ngView作用域上发布$locationChangeStart($broadcast事件)
通过$location服务对浏览器的地址更新时会触发$locationChangeStart事件$locationChangeSuccess($broadcast事件)
当浏览器的地址成功变更时触发$routeChangeStart($broadcast事件)
在路由变更发生之前,该事件从$rootScope发布相关文章推荐
- 夺命雷公狗—angularjs—5—ng-switch的用法实现下拉更换板块的实现
- 夺命雷公狗—angularjs—25—angular内置的方法(高级)
- 夺命雷公狗ThinkPHP项目之----企业网站18之网站配置列表页的完成
- 夺命雷公狗—angularjs—6—单条数据的遍历
- 夺命雷公狗—angularjs—12—get参数的接收
- 夺命雷公狗—angularjs—1—三种数据版定方式
- 夺命雷公狗—angularjs—15—内置封装好的计时器$interval和$timeout
- 夺命雷公狗—angularjs—8—ng-class的简单用法
- 夺命雷公狗—angularjs—22—bind改指向和传参方式
- 夺命雷公狗—angularjs—2—模拟表单验证
- 夺命雷公狗—angularjs—24—extend继承对象
- 夺命雷公狗—angularjs—10—angularjs里面的内置函数
- 夺命雷公狗—angularjs—3—表单验证的高级用法
- 夺命雷公狗—angularjs—19—angular-route
- 夺命雷公狗—angularjs—13—post参数的接收发送
- 夺命雷公狗—angularjs—17—angularjs的静态库
- Angularjs中table中实现点击td中按钮不触发tr的点击事件
- angularJS 常用的渲染指令、事件指令和节点指令
- angularjs-常用angular事件
- angularjs 动态表单, 原生事件中调用angular方法