ANGULAR之中的$STATE、 $WATCH、 $SCOPE、 $ROOTSCOPE 分别是什么?

版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/jnshu_it/article/details/86595168

这里是修真院web小课堂,每篇分享文从

【背景介绍】【知识剖析】【常见问题】【解决方案】【编码实战】【扩展思考】【更多讨论】【参考文献】

八个方面深度解web知识/技能,本篇分享的是:

【ANGULAR之中的$STATE、 $WATCH、 $SCOPE、 $ROOTSCOPE 分别是什么?】

1.背景介绍

在平时的编码中,我们总会想着有什么方法能够简化我们的工作流程,让我们只专心于业务逻辑和数据的处理,而angularjs 就为我们程序员实现了这一点。$scope $rootScope $watch 和 $state就是里面的几个方法,今天着重跟大家讨论一下这 几个方法。

2.知识剖析

$SCOPE

$scope在angularjs中,你可以把它理解成作用域,每个不同的controller,都具有它不同的作用域,所以 controller不同,他们的scope是不同的。

Scope(作用域) 是应用在 HTML (视图) 和 JavaScript (控制器)之间的纽带。

Scope 是一个对象,有可用的方法和属性。

Scope 可应用在视图和控制器上。

scope 是模型。

scope 是一个 JavaScript 对象,带有属性和方法,这些属性和方法可以在视图和控制器中使用。

如果我们想象js那样,做一个全局变量该怎么办呢?这就要说 到rootScope了。

$ROOTSCOPE

$rootScope就相当于一个全局作用域,所以我们保存在其中的东西是全局性的,在任一controller之中都能够使用

scope是html和单个controller之间的桥梁,数据绑定就靠他了。rootscope是各个controller中scope的桥梁。 用rootscope定义的值,可以在各个controller中使用。

所有的应用都有一个$rootScope,它可以作用在ng-app指令包含的所有 HTML 元素中。

$rootScope可作用于整个应用中。是各个 controller 中 scope 的桥梁。用 rootscope 定义的值,可以在各个 controller 中使用。

$rootscope设置的变量在所有controller里面都是可以直接用{{$root.变量名}}来显示的,当然也可以赋值给$scope.

$rootScope 全局对象的属性可在所有子作用域中访问,子作用域互相无法访问对方的私有变量,这一点与js的函数作用域完全一致。

$WATCH

相信使用过angularjs的同学都知道,ng中有个比较重要的特点,叫做双向绑定,那么这个双向绑定是如何实现的呢? 当我们在创建出scope下的一个新属性的时候,ng就会主动为我们新属性加上$watch这个方法,这个方法会监听我们 的数据变化,当数据变化之后,就立即把view和scope上数据同步。

$watch(watchExpression, listener, objectEquality);

watchExpression:需要监控的表达式

listener:处理函数,函数参数如下 function(newValue,oldValue, scope)

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

$STATE

在ajax技术发展普及之后,因为其不会留下历史记录方便浏览器访问和对于seo不友好的特点,一个新技术应运而生: 路由,$state就是路由中的一项服务。

3、参考文献:

angularJS中的$watch方法监听作用域

AngularJS Scope(作用域)



作者:小翼_b998
链接:https://www.jianshu.com/p/f19adf38dd06
來源:简书
简书著作权归作者所有,任何形式的转载都请联系作者获得授权并注明出处。

如果这篇文章对你有帮助,并且使你对修真院免费在线学习感兴趣,可以通过我的邀请链接进行注册,这样可以在日后为你的线下学习减免学费。

邀请链接:http://www.jnshu.com/login/1/23246304

邀请码:23246304

更多内容,可以加入IT交流群565734203与大家一起讨论交流

这里是技能树·IT修真院:https://www.jnshu.com,初学者转行到互联网的聚集地

猜你喜欢

转载自blog.csdn.net/jnshu_it/article/details/86595168