1.$watch简单使用

$watch是一个scope函数，用于监听模型变化，当你的模型部分发生变化时它会通知你。

$watch(watchExpression, listener, objectEquality);

每个参数的说明如下：

  1. watchExpression：监听的对象，它可以是一个angular表达式如'name',或函数如function(){return $scope.name}。

  2. listener:当watchExpression变化时会被调用的函数或者表达式,它接收3个参数：newValue(新值), oldValue(旧值), scope(作用域的引用)

  3. objectEquality：是否深度监听，如果设置为true,它告诉Angular检查所监控的对象中每一个属性的变化. 如果你希望监控数组的个别元素或者对象的属性而不是一个普通的值, 那么你应该使用它

$watch可以监听多个模型的变化

<body ng-app="app" ng-controller="first">

        <button ng-click="name='a'">1</button>

        <button ng-click="name='b'">2</button>

        <button ng-click="name='c'">3</button>

        <button ng-click="type=2">4</button>

        <button ng-click="type=3">5</button>

        <p>{{name}}</p>

    </body>

    <script type="text/javascript">

        var app = angular.module("app", []);

        app.controller("first", function($scope) {

            $scope.name = 'q';

            $scope.type = 1;

            function te() {

                console.log($scope.name+" "+ $scope.type);

            }

            $scope.$watch('name+type', function(newValue, oldValue) {                 //2个参数为 一个为新值，一个为旧值

                te();

            });

        })

    </script>

　

2.$on的用法

$on是一个scope函数，用于监听事件的变化，当你的事件发生时它会通知你。

module.controller('freefedCtrl',['$scope',function($scope){

         //监听directiveClick事件

         $scope.$on('directiveClick',function(event,param){

               console.log( param );    // 打印结果 {title : '我是来自指令子级作用域'}

         });

         $scope.change = function(title){

              var result = '请注意接收父级广播';

              //向子级作用域广播parentBroadcast事件

              $scope.$broadcast('parentBroadcast',{msg : result});

         };

  }]);

　　

angularjs中 $watch 和$on 2种监听的区别？的更多相关文章

  1. Android中Button的五种监听事件

    简单聊一下Android中Button的五种监听事件: 1.在布局文件中为button添加onClick属性,Activity实现其方法2.匿名内部类作为事件监听器类3.内部类作为监听器4.Activ ...

  2. Android------三种监听OnTouchListener、OnLongClickListener同时实现即其中返回值true或者false的含义

    引自:http://5200415.blog.51cto.com/3851969/1003113 android应用中常用的监听OnTouchListener.OnClickListener.OnLo ...

  3. OnClickListener两种监听方法

    //1种:接口OnClickListener ,在onclick响应 public class MainActivity extends Activity implements OnClickList ...

  4. jQuery中四种事件监听的区别

    原文链接:点我 我们知道jquery提供了四种事件监听方式,分别是bind.live.delegate.on,下面就分别对这四种事件监听方式分析. 已知有4个列表元素: 列表元素1 列表元素2 列表元 ...

  5. java中的四种监听类用法

    在此列举四种方法: 自身类实现ActionListener接口,作为事件监听器 通过匿名类处理 通过内部类处理 通过外部类处理 下面依次介绍: 第一种:自身类实现ActionListener接口,作为 ...

  6. jquery四种监听事件的区别

    最近找工作被问到了jquery有哪些事件监听,都有什么区别,忽然有点想不起来了... 然后上网上查看了相关的资料,总结一下,方便大家查看,也方便自己复习! 1.bind()方法: bind(type, ...

  7. RecyclerView的2种监听方式

    NO.1:在自己定义适配器的ViewHolder里面写监听事件 //RecyclerView适配器 public class RecyclerViewAdapter extends RecyclerV ...

  8. javascript：判断支持哪种监听

    if (typeof window.addEventListener != "undefined") { window.addEventListener("load&qu ...

  9. Android ScrollView监听滑动到顶部和底部的两种方式（你可能不知道的细节）

    Android ScrollView监听滑动到顶部和底部,虽然网上很多资料都有说,但是不全,而且有些细节没说清楚 使用场景: 1. 做一些复杂动画的时候,需要动态判断当前的ScrollView是否滚动 ...

随机推荐

  1. c++ 判断是64还是32位系统

    1.IsWow64Process 确定指定进程是否运行在64位操作系统的32环境(Wow64)下. 语法 BOOL WINAPI IsWow64Process( __in HANDLE hProces ...

  2. day 15

    1.input标签默认内容 Title <input value="默认内容"/> <hr /> <textarea>默认内容</text ...

  3. C++ *this与this的区别（系个人转载，个人再添加相关内容）

    转载地址:http://blog.csdn.net/stpeace/article/details/22220777 return *this返回的是当前对象的克隆或者本身(若返回类型为A, 则是克隆 ...

  4. 面试准备5之rest-framework部分

    rest-framework部分 1.你理解的Http协议? 答:1超文本协议,基于tcp协议的应用层协议,端口号80 本质就是一个socket客户端.请求-->响应-->断开 2 无连接 ...

  5. 爬虫入门之Scrapy框架基础rule与LinkExtractors(十一)

    1 parse()方法的工作机制: 1. 因为使用的yield,而不是return.parse函数将会被当做一个生成器使用.scrapy会逐一获取parse方法中生成的结果,并判断该结果是一个什么样的 ...

  6. eclipse通过maven进行打包并且对hdfs上的文件进行wordcount

    在eclipse中配置自己的maven仓库 1.安装maven(用于管理仓库,jar包的管理) -1.解压maven安装包 -2.把maven添加到环境变量/etc/profile -3.添加mave ...

  7. ES6 Map遍历、filter()筛选对象

    目录: -------- 1.map() -------- 2.filter(): ------------- 2.1.filter函数可以看成是一个过滤函数,返回符合条件的元素的数组 ------- ...

  8. Android Studio添加取消代码注释快捷键

    经常需要注释,取消注释代码 Ctrl + /       对每段代码前面添加或者取消 // Ctrl + Shift + /   对代码添加 或取消 /* */ Ctrl + B     查找定义 C ...

  9. 040同步条件event

    条件同步和条件变量同步差不多意思,只是少了锁功能,因为条件同步设计于不访问共享资源的条件环境,event=threading.Event():条件环境对象,初始值为False.event.isSet( ...

  10. 七.部署war包到Tomcat(基于Centos安装)

    1.把war包上传至tomcat的webapps目录下面 2.启动Tomcat,在Tomcat的bin目录下面,运行startup.sh 3.访问项目,如下成功打开项目