angularJS的事件不像js一样，会默认有冒泡和捕获，还有angularJS之间的同名控制器之间，也只是同名，

不会让他们关联起来，就是这个名字的控制器的数据的改变不会影响到另一个同名的控制器。

但同名控制器之间可以使用的事件处理，让其有冒泡和捕获的机制。

如：

<!DOCTYPE html>

<html lang="en" ng-app="myApp">

<head>

    <meta charset="UTF-8">

    <title>Document</title>

    <script src="angularjs-v1.5.9.js"></script>

</head>

<body>

<!-- $broadcast()捕获 -->

<div ng-controller="myCon" ng-click="$broadcast('change')">

{{count}}

    <div ng-controller="myCon" >

        {{count}}

        <!-- $emit()冒泡 -->

        <div ng-controller="myCon" ng-click="$emit('change')">

            {{count}}

        </div>

    </div>

</div>

    <script>

        var myApp=angular.module("myApp",[])

        .controller("myCon",function($scope){

            $scope.count=0;

            $scope.$on("change",function(){

                $scope.count++;

            })

        })

    </script>

</body>

</html>

$on()给就像addEventListener()。

补充动画那块：

因为angularJS的动画插件不是添加删除class,就是添加删除DOM，所以使用animate的css动画库，应该更加简单实现动画效果。

ng-show;ng-if;

angularJS之事件处理的更多相关文章

  1. AngularJS学习--- 事件处理(Event Handlers) ng-click操作 step 10

    本文主要通过介绍ng-click方法来对angularjs中的事件处理方法做个了解. 1.切换目录 git checkout step- npm start 2.效果 点击右边的小图片,那么左边框中将 ...

  2. AngularJS 脏检查深入分析

    写在开头 关于Angular脏检查,之前没有仔细学习,只是旁听道说,Angular 会定时的进行周期性数据检查,将前台和后台数据进行比较,所以非常损耗性能. 这是大错而特错的.我甚至在新浪前端面试的时 ...

  3. 基于 Angularjs&Node.js 云编辑器架构设计及开发实践

    基于 Angularjs&Node.js 云编辑器架构设计及开发实践 一.产品背景 二.总体架构 1. 前端架构 a.前端层次 b.核心基础模块设计 c.业务模块设计 2. Node.js端设 ...

  4. angularjs 的笔记

    angular.copy()深拷贝 angular提供了一个可以复制对象的api--copy(source,destination),它会对source对象执行深拷贝. 使用时需要注意下面几点: 如果 ...

  5. 使用 AngularJS & NodeJS 实现基于token 的认证应用（转）

    认证是任何 web 应用中不可或缺的一部分.在这个教程中,我们会讨论基于 token 的认证系统以及它和传统的登录系统的不同.这篇教程的末尾,你会看到一个使用 AngularJS 和 NodeJS 构 ...

  6. AngularJS快速入门01-基础

    记得第一次听说AngularJS这项很赞的Web的前端技术,那时还是2014年,年中时我们我的一个大牛兄弟当时去面试时,被问到了是否熟悉该技术,当时他了解和使用的技术比较多.我们询问他面试情况时,他给 ...

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

    AngularJS中的作用域有一个非常有层次和嵌套分明的结构.其中它们都有一个主要的$rootScope(也就说对应的Angular应用或者ng-app),然后其他所有的作用域部分都是继承自这个$ro ...

  8. angularjs学习总结 详细教程（转载）

    1 前言 前端技术的发展是如此之快,各种优秀技术.优秀框架的出现简直让人目不暇接,紧跟时代潮流,学习掌握新知识自然是不敢怠慢. AngularJS是google在维护,其在国外已经十分火热,可是国内的 ...

  9. HTML+AngularJS+Groovy如何实现登录功能

    AngularJS是一款优秀的前端JS框架,已经被用于Google的多款产品当中.AngularJS核心特性有:MVVM.模块化.自动化双向数据绑定.语义化标签.依赖注入等.AngularJS认为声明 ...

随机推荐

  1. 天气预报API(三)：免费接口测试（“旧编码”）

    说明 我以参考文章为引子,自己测试并扩展,努力寻找更多的气象API... 本文所有测试均以青岛为例. 本文所列接口城市代码(cityid)参数都使用的 "旧编码": 全国城市代码列 ...

  2. ios xcode 下 报出 ”xx“is missing from working copy 的问题

    在项目中提交过svn后,再在本机上删除不用的图片资源后,build后会有   ”xx“is missing from working copy  的警告.在网上找了些资料后,总结下. 直接在终端下用s ...

  3. Linq-分组统计

    using System; using System.Collections.Generic; using System.Linq; using System.Text; namespace Cons ...

  4. Hive使用技巧

    hive默认查询不会显示列名, 当一个表字段比较多的时候,往往看不出值与列之间的对应关系,对日常查错及定位问题带来不便,像下面这样. hive> >select * from exampl ...

  5. maven清除不同版本的重复依赖

    pom文件加入: <dependencyManagement> <dependencies> <dependency> <groupId>org.spr ...

  6. 转：linux coredump调试

    1 )如何生成 coredump 文件 ? 登陆 LINUX 服务器,任意位置键入 echo "ulimit -c 1024" >> /etc/profile 退出 L ...

  7. 用Yaml文件进行元素管理【转】

    原文:http://www.cnblogs.com/milanmi/p/4636503.html 如界面有一个按钮,id号是test.如果进行对象化的话,就是test.click就可以了.不用每次都要 ...

  8. java和android及IOS对接RSA加密经验

    1.网上找的java生成RSA密钥对的例子,产生的字附串实际上是hax后和密钥串 你可以将他们当成静态字附串存在java代码里 2.android和java可以代码复用,IOS对接比较麻烦 3.IOS ...

  9. Ubuntu/Linux 下pdf阅读器Zathura(类vim操作)

    Ubuntu下源安装: sudo apt-get install zathura 操作总结: 基本操作与vim一致,对于熟悉vim快捷键的十分方便: 向下移动一页是J(Ctrl+f),向上移动一页是K ...

  10. 2.使用JDK开发webService

    使用jdk开发webService需要注意:jdk版本必须1.6以及1.6以上! 以下webService的组成部分: server端和client端,通过服务器端(server)webService ...