对于一款前端框架,提起事件,很容易让人联想到DOM事件,比如说鼠标点击以及页面滚动等。但是我们这里说的angular中的事件和DOM事件并不是一个东西。

事件的发布

我们可以通过 $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—18—angularjs的事件的更多相关文章

  1. 夺命雷公狗—angularjs—6—单条数据的遍历

    我们在实际的工作中常常会处理到一些数据的遍历,这些数据都是后端传到前端的,有些公司会让前端帮忙处理一点遍历的工作,废话不多说,直接上代: <!doctype html> <html ...

  2. 夺命雷公狗---微信开发17----自定义菜单的事件推送,响应菜单的CLICK

    废话不多说,index.php 代码如下所示: <?php /** * wechat php test */ //define your token require_once "com ...

  3. 夺命雷公狗---微信开发59----在线点播电影网1之ckplayer播放器

    我们节课程就要开始写一个小项目了,这项目主要是写一个在线点播电影影网的,我们用到的播放器是ckplayer ckplayer基本介绍: ckplayer的全称是:超酷flv播放器,他是一款用于网页上播 ...

  4. 夺命雷公狗-----React---12--添加类和样式

    <!DOCTYPE> <html> <head> <meta charset="utf-8"> <title></ ...

  5. 夺命雷公狗-----React---11--添加css样式的方法

    <!DOCTYPE> <html> <head> <meta charset="utf-8"> <title></ ...

  6. 夺命雷公狗-----React---10--组建嵌套进行数据遍历

    先写一个组建... 然后进行嵌套.. <!DOCTYPE html> <html lang="en"> <head> <meta char ...

  7. 夺命雷公狗-----React---9--map数据的遍历

    比如我们要实现的是这种效果: 用这种方法来写,她只能写死在哪,没啥意思,所以我们定义一个数据,然后来测试下map方法对她遍历出来的数据 <!DOCTYPE html> <html l ...

  8. 夺命雷公狗-----React---8--react官方提供的组建实现双向绑定

    首先要引入她.. <!DOCTYPE html> <html lang="en"> <head> <meta charset=" ...

  9. 夺命雷公狗-----React---7--组建的状态props和state

    props:组建初始要渲染的数据,他是不可以改变的 state:组建状态发生改变,调用render重新渲染数据 我们来写一个例子: <!DOCTYPE html> <html lan ...

  10. 夺命雷公狗-----React---6--props多属性的传递

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

随机推荐

  1. SQL backup&restore

    --完整备份Backup Database NorthwindCSTo disk='G:\Backup\NorthwindCS_Full_20070908.bak' --差异备份Backup Data ...

  2. Linux学习之CentOS(十)--虚拟机下的CentOS如何上网

    原地址:http://www.cnblogs.com/xiaoluo501395377/archive/2013/04/05/3001148.html 这篇随笔应该说跟CentOS的学习关系不是很大, ...

  3. RTSP交互命令简介及过程参数描述

    目录 [hide] 1 RTSP消息格式 2 简单的rtsp交互过程 3 rtsp中常用方法 3.1 OPTION 3.2 DESCRIBE 3.3 SETUP 3.4 PLAY 3.5 PAUSE ...

  4. Magento 安装时文件权限 设置

    http://www.magentocommerce.com/wiki/1_-_installation_and_configuration/magento_filesystem_permission ...

  5. 模糊搜索UISearchBar

    #import "Search_ViewController.h" @interface Search_ViewController ()<UITableViewDataSo ...

  6. office-002-onenote、word、outlook取消首字母大小写图文详解

    此文主要讲述如何取消微软办公软件 onenote.work.outlook 中首字母大写等的自动更正项,其他 office 办公软件相关设置的操作,可参考此文进行相应的设置.希望能对亲有所帮助,若有错 ...

  7. Windows7下 配置 Apache + PHP + MySQL + Zend Studio配置

    相关软件下载: Apache                               版本:(httpd-2.2.25) PHP                                   ...

  8. 网站启动SSL, http变为https后,session验证码错误解决方法

    网站启动SSL, http变为https后,session验证码错误解决方法   最近公司需要后台启动安全证书,证书安装完毕后,后台老提示 验证码错误,经过几天的研究,此问题已经得到有效解决,现把方法 ...

  9. Ninject简单的Demo

    using System; using System.Collections.Generic; using System.Linq; using System.Text; using System.T ...

  10. 成员变量NSString类型指针的属性为什么用copy(属性)

    创建一个分类Person设置属性@property(nonatomic,strong) NSString * name; 在- (void)viewDidLoad 中打印测试 name的属性是stro ...