(五下)作用域,及其特点,$watch方法,$digest方法,$apply方法

作用域

  • AngularJS对象提供的controller方法可以创建控制器。
  • 创建控制器后,需要区别控制器所支持的视图。
  • 通过ng-controller指令可以指定控制器支持的视图。
  • 控制器的参数包括一个工厂函数,该函数接受一个参数$scope,表明该控制器对$scope服务的依赖。这时控制器可以通过$scope对应的作用域与视图建立联系。
  • $scope作用域不但定义了控制器和视图之间的关系,而且对许多重要的AngularJS特性如:数据绑定,提供了运转机制。
  • 控制器通过在控制器函数中定义数据和行为使用作用域。
  • $scope对象实际上是一个作用域对象,作用域能存储数据模型,为表达式提供上下文环境,监听表达式的变化,传播事件。是视图和控制器之间的重要桥梁。
    作用域的特点:
  • 为表达式提供执行环境,一个表达式必须在拥有该表示式属性的作用域中执行。作用域通过提供$scope对象,使所有的表达式都拥有对应的执行环境,也就是执行的上下文。
  • 提供了一个$watch方法监听数据模型的变化,之所以能使用ng-model指令实现数据的双向绑定,就是隐式的调用该方法进行数据模型的监听,只要有一端发生变化,另外绑定的一端自动进行数据同步。
  • 提供了一个$apply方法,为各种类型的数据模型改变提供支撑,将它们引入到Angular可控制的范围中。这个可控制的范围最典型的就是控制器,例如:通过ng-click指令,执行控制器中的代码。

    $watch方法
    watchscope watch(watchExpression, listener, objectEquality);
    每个参数的说明如下:

  • watchExpression(必须):监听的对象,它可以是一个string,将被计算为表达式,或函数如function(){return $scope.name}。

  • listener:当watchExpression(监听对象)变化时会被调用的函数或者表达式,它接收3个参数:newValue(新值), oldValue(旧值), scope(作用域的引用)
  • objectEquality:是否深度监听,如果设置为true,它告诉Angular检查所监控的对象中每一个属性的变化.如果你希望监控数组的个别元素或者对象的属性而不是一个普通的值, 那么你应该使用它
    $digest方法
  • Angular会运行一个函数$digest来检查scope模型中的数据是否发生了变化。
  • 在$digest循环中,watchers会被触发。当一个watcher被触发时,AngularJS会检测它所监听的scope模型,如果监听对象发生了变化那么关联到该watcher的回调函数就会被调用。

这种方法叫做脏检查。

  • 在angular程序初始化时,会将绑定对象的属性添加为监听对象(watcher),也就是说一个$scope对象绑定了N个属性,就会添加N个watcher。
  • angular什么时候去脏检查呢?angular所定义的方法中都会触发$digest事件,比如:controller初始化的时候,所有以ng-开头的指令
  • 执行后,都会触发脏检查用户与视图发生交互行为以后会触发脏检查。调用 digest scope.$digest();
    $apply方法
  • AngularJS并不直接调用 digest() scope. apply() apply方法就是将 digest rootScope. digest() digest循环$rootScope开始,随后会访问到所有的children scope中的watchers。
  • $apply()方法接受一个可选参数,可以是string,string将被看作表达式并计算结果,也可以是函数。
  • 当接受function作为参数,会执行该function并且触发一轮$digest循环。
  • 不接受任何参数,触发一轮 digest scope里的所有监听的属性。
  • 如果你在AngularJS上下文之外的任何地方修改了model,那么你就需要通过手动调用$apply()来通知AngularJS。
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
AngularJS中,$digest是一个循环机制,用于检查和更新作用域中的所有绑定。它会遍历作用域树,并检查每个作用域中的所有watcher。当检测到一个watcher的值发生变化时,$digest会触发这些watcher的回调函数,从而更新相应的视图。 $digest循环由AngularJS自动触发,不需要手动调用。当AngularJS检测到可能发生变化的事件(例如用户输入、HTTP请求的响应等)时,它会自动启动$digest循环。在这个过程中,AngularJS会检查每个作用域中的watcher,并更新视图以反映最新的模型状态。 然而,有时候我们需要在AngularJS上下文之外修改模型,并希望通知AngularJS进行更新。这时就可以使用$apply方法。$apply方法会触发$digest循环,强制AngularJS检查和更新所有作用域中的watcher。 一种常见的使用场景是在使用第三方库或原生JS代码时,需要手动调用$apply方法来通知AngularJS进行更新。在这种情况下,我们可以将修改模型的代码包裹在$apply函数中,以确保AngularJS能够正确地检测到变化并更新相应的视图。 总结起来,$digestAngularJS自动触发的循环机制,用于检查和更新作用域中的所有绑定。而$apply是手动调用的方法,用于通知AngularJSAngularJS上下文之外的代码中发生了模型的变化,需要进行更新。 :https://www.jb51.net/article/120399.htm :https://stackoverflow.com/questions/41285152/when-to-call-scope-apply-in-angularjs

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值