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. git常用命令#自用#

    =====  未完结,慢慢补充 =====   零.克隆 1.克隆主分支 : git clone ${remotePath} 2.克隆指定分支 : git clone -b <branch na ...

  2. Retrofit-入门使用

    1. 在模块目录下的build.gradle dependencies { compile "com.squareup.retrofit2:retrofit:2.1.0" comp ...

  3. 实验 MPLS LDP配置

    实验 MPLS LDP配置 一.学习目的 掌握启用和关闭MPLS的方法 掌握启用和关闭MPLS LDP配置方法 掌握使用MPLS LDP配置LSP的方法 二.拓扑图 三.场景 你是公司的网管员,公司的 ...

  4. centos无法用password登录,只能用public key的解决办法

    如上图只能用public key登录,只是我在17年申请的阿里云免费体验半年的服务器上遇到的, 那么我们用阿里云后台的远程连接按钮进入服务器,进入后 就看/etc/ssh/sshd_config文件配 ...

  5. htm5 手机自适应问题 文本框被激活(获取焦点)时,页面会放大至原来尺寸。

    加上这句话就ok啦 <meta name="viewport" content="width=device-width, initial-scale=1.0, mi ...

  6. 一个较复杂的执行redis的lue脚本

  7. macbook pro 2016 2017 15寸 雷电3 外接显卡 epu 简单教程(不修改UEFI)

    雷电3外接显卡效果还不错,但是除了akitio node 其他厂家并不会维护自己的固件来适配新机型,我自己买的mbp 2016 15''就出现了和AORUS Gaming Box 1070不兼容的问题 ...

  8. 如何用SAP Cloud for Customer的手机App创建销售订单

    第一次启动App,设置一个初始化的pin code: 输入C4C tenant的url,用户名和密码: 登录进系统后,找到Sales Order工作中心: 可以看到系统里很多已有的销售订单了.点击屏幕 ...

  9. mysql 查询大量数据报错

    错误:Incorrect key file for table '/tmp/#sql_... 由于一次查询出大量数据,并且使用了临时表,导致产生此错误,主要是存放临时表文件的/tmp目录大小不足导致.

  10. 在giuhub上演示自己的项目

    首先在github上建立项目,然后git clone; 然后切换分支到 git checkout gh-pages 最后提交代码到这个分支上,访问地址:[github用户名].github.io/[项 ...