菜单

watch详解_AngularJS_脚本之家

2020年3月14日 - www.2138.com

$parse和$eval

$parse和$eval那八个函数都能够解析表明式的值.

它们的分别在于$parse是三个服务, 能够注入使用.
$eval是scope对象上的一个主意, 大家只幸亏能访谈scope的风貌下利用它.

var getter = $parse;var setter = getter.assign;var context = {user: {name: 'John Doe'};var locals = {user: {name: 'Doe John'};getter; //John Doesetter;getter; //new namegetter; //Doe John

$parse服务收取三个表达式作为参数并重回一个函数. 这几个函数可以被调用,
在那之中的参数是叁个context对象, 常常来讲是效能域.别的,
那些函数有叁个assign属性. 它也是贰个函数,
能够用来在给定的上下文中改动那一个表明式的值.
最终一行代码演示了怎么样行使locals来覆盖context对象.

$eval用起来要简明相当多, 因为它的上下文已经被钦定为scope对象.

var scope = $rootscope.$new;scope.a = 1;scope.b = 2;scope.$eval//3scope.$eval{ return scope.a + scope.b;});//3

关于$parse和$eval之间的关系, 大家能从Angular源码中看出来,
能够说$eval是为着让$parse在scope中使用更方便的语法糖.

$eval: function{ return $parse;}

$eval还会有个同胞兄弟, $evalAsync, 它并不会及时计算表明式的值,
而是将表明式缓存起来, 等到下一遍$digest 的时候试行. 以获取越来越好的品质.

$observe和$watch

$observe和$watch都得以监听表明式值的变化.
但有显着的不一样.$observe是angular指令中link函数第八个参数 的五个方法.
只可以在指令的link函数中央银行使它. 它是透过$evalAsync函数达成监督的.

$watch是scope对象上的二个方式, watch表明式很灵活, 能够是三个函数,
能够是scope上的习性, 也得以是三个字符串情势的发布式.
监听scope上的属性名或表明式的时候,
会利用$parse服务将表达式调换来五个函数, 这些函数会在$digest中被调用.
$watch的第几个参数”objectEquality”, 钦点比较对象的方法,
假如为true,则用angular.equals, 不然直接相比较援引. 默感到false.

//html//jsattrs.$observe('book', function{ //just have one parameter, can't get old value});scope.$watch(attrs.book, function{ //get undefined});

当您要求监听叁个富含”{{}}”的DOM属性时, 使用$observe, 若是用$watch,
只可以赢得undefined. 反之, 就用$watch. 借使用$observe,
只好获取一个一定的字符串.

//html//jsattrs.$observe('book', function{ //always get 'book.name'});scope.$watch(attrs.book, function{});

有一个特其他气象, 当你的吩咐使用了独立的成效域 ,
那么些运用了”@”语法的DOM属性, 固然带有”{{ }}”, 也得以被$watch.

因为@前缀标志符, 它的贯彻是因而$observe去监听DOM属性的变化,
那便是干什么@attr的值只好是字符串或是”{{}}”, 而不可能是scope上的属性,
所以最后$watch看见的表达式是绝非”{{ }}”的. 而”=”和”&”则是依据$watch完成.
所以=attr, &attr的值不可能包涵”{{ }}”, 但能够一贯使用scope上的属性.

$watchGroup和$watchCollection

$watchGroup是用来监听一组表明式. 数组中私行表明式的变型都会触发监听函数.

$scope.teamScore = 0;$scope.time = 0;$scope.$watchGroup(['teamScore', 'time'], function { //newVal and oldVal are both array});

$watchCollection用来监听一个目的, 当那一个指标的自便属性发生变化时,
触发监听函数. 和$watch相近,第贰回参数能够是贰个回去四个指标的函数.

$scope.names = ['igor', 'matias', 'misko', 'james'];$scope.dataCount = 4;$scope.$watchCollection('names', function  { $scope.dataCount = newVal.length;});$timeout{ $scope.names.pop;

$observe, $watch, $watchGroup, $watchCollection都回到二个移除监听的函数.
当要求撤废监听的时候, 间接调用.

var off = scope.$watch('name', function{});off();

如上就是对AngularJs
$parse、$eval和$observe、$watch的学问详明,多谢大家对本站的协助!

相关文章

发表评论

电子邮件地址不会被公开。 必填项已用*标注

网站地图xml地图