资讯专栏INFORMATION COLUMN

angularjs 某个作用域监听全局变量的正确姿势

gclove / 3667人阅读

摘要:因为在上的一旦注册全局有效。而我的这个全局变量恰好是订单信息,也就是说不同的对他都是有改动的,每一次改动就会触发进入别的。可以类比看一下上的会全局出发的。例如手动清除还是很简单对吧,以上方法同样可以用于上的。

如果你只想知道结论:

$scope.$watch(function(){$rootScope.xxx;},function(newVal,oldVal){
    //do something
})

马上就有人问为什么不是:

$rootScope.$watch("xxx",function(newVal,oldVal){
  //do something
})

从我最近的一个bug来说说为什么要用第一种方式。

逻辑如图,一开始我使用了 $rootScope.$watch 的写法。因为 angularjs 在 $rootScope 上的 watch 一旦注册全局有效。而我的这个全局变量恰好是订单信息,也就是说不同的 controller 对他都是有改动的,每一次改动就会触发 $rootScope.$watch 进入别的 controller。可以类比看一下 $rootScope 上的 $broadcast 会全局出发的。

其实这并不是唯一的方式,查一下angular 源码不难找到 watch 方法源码不分有如下代码:

return function deregisterWatch() {
  if (arrayRemove(array, watcher) >= 0) {
      incrementWatchersCount(scope, -1);
  }
  lastDirtyWatch = null;
};

这段代码告诉我们,手动清理 watch 是可行的。例如:

var watcher = $rootScope.$watch("xxx",function(){});
//手动清除 watcher 
watcher();

还是很简单对吧,以上方法同样可以用于 scope 上的 watch。

研究到这里的时候,觉得有点问题,那我在 $scope 会被清理么?于是呼,继续翻源码,我在 $destroy 方法里面找到如下代码:

// Disable listeners, watchers and apply/digest methods
this.$destroy = this.$digest = this.$apply = this.$evalAsync = this.$applyAsync = noop;
this.$on = this.$watch = this.$watchGroup = function() { 
  return noop; 
};
this.$$listeners = {};

以上代码分析很有可能有错,仅做参考,如有错误欢迎指正。

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/78630.html

相关文章

  • 【转】angularJS兄弟controller之间如何正确通信

    摘要:每个的指向指向父级作用域。之间的通信本质上是当前的所在的如何跟其他上的进行通信。传递事件有种方式触发的事件要通知整个事件系统允许任意作用域处理这个事件就要向下传播。作用域上使用进行事件监听。示例关于同级之间通信我的一个提问 原文链接:http://www.cnblogs.com/webbes... AngularJS中的controller是个函数,用来向视图的作用域($scope)添...

    forsigner 评论0 收藏0
  • AngularJs

    摘要:当左右服务都被解析并返回时,会以服务为参数去调用组件的构造函数。发送或广播的消息应该限定在最小的作用域。置顶一个通过,发送的消息列表并且窒息的管理以防止命名冲突在需要格式化数据时,将格式 angular 数据双向绑定的框架 提供数据绑定,DOM指令。angular,定义了一套规则,开发中就必须遵守规则,这套规则为项目提供了一套解决方案。 模块,组件,模板,元数据,数据绑定, 指令,服务...

    sf190404 评论0 收藏0
  • angularJS开发注意事项汇总

    摘要:作为一个应该具有经常总结反思的习惯如果不能及时总结可能就会忘记自己踩过的很多坑然后会导致同一个坑踩很多次所以我打算把这些都记录下来以方便是对自己的重复记忆避免无效的另一方面可以希望可以给遇到相似问题的同僚们一些收获手动触发脏检查在开发过程中 作为一个coder,应该具有经常总结反思的习惯,如果不能及时总结,可能就会忘记自己踩过的很多坑,然后会导致同一个坑踩很多次,所以我打算把这些都记录...

    Null 评论0 收藏0
  • 【译】《精通使用AngularJS开发Web App》(三)--- 深入scope,继承结构,事件系

    摘要:比如,我们可以监听事件由实例发出,然后在任何浏览器中就是变化的时候都会得到通知,如下所示每一个作用域对象都会有这个方法,可以用来注册一个作用域事件的侦听器。这个函数所扮演的侦听器在被调用时会有一个对象作为第一个参数。 上一篇:【译】《精通使用AngularJS开发Web App》(二) 下一篇:【译】《精通使用AngularJS开发Web App》(四) 书名:Mastering W...

    wind5o 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<