angular之中,$state $watch $scope $rootScope 分别是什么?

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

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

【angular之中,$state $watch $scope $rootScope 分别是什么? 】

1.背景介绍

AngularJs是一个用于设计动态web应用的结构框架,使得开发现代的单一页面应用程序变得更加容易。而且能够简化我们的工作流程, 让我们只专心于业务逻辑和数据的处理。$scope $rootScope $watch 和 $state就是里面的几个方法。

2.知识剖析

1、 s c o p e — — S c o p e ( 作 用 域 ) 是 应 用 在 H T M L ( 视 图 ) 和 J a v a S c r i p t ( 控 制 器 ) 之 间 的 纽 带 。 S c o p e 是 一 个 对 象 , 有 可 用 的 方 法 和 属 性 。 S c o p e 可 应 用 在 视 图 和 控 制 器 上 。 scope——Scope(作用域) 是应用在 HTML (视图) 和 JavaScript (控制器)之间的纽带。Scope 是一个对象,有可用的方法和属性。 Scope 可应用在视图和控制器上。 scopeScope()HTML()JavaScript()ScopeScopescope 的使用贯穿整个 Angular App 应用,它与数据模型相关联,同时也是表达式执行的上下文。 有了 $scope 就在视图和控制器之间建立了一个通道,基于作用域视图在修改数据时会立刻更新 $scope, 同样的 $scope发生改变时也会立刻重新渲染视图。

2、$rootscope——每一个Angular应用都会有一个 $rootScope。这个 $rootScope 是最顶级的scope,它对应着含有 ng-app 指令属性的那个DOM元素。 如果页面上没有明确设定 $scope ,Angular 就会把数据和函数都绑定到这里。Angular 应用启动并生成视图时,会将根 ng-app 元素与 r o o t S c o p e 进 行 绑 定 . rootScope 进行绑定. rootScope.rootScope 是所有 $scope 的最上层对象, 可以理解为一个 Angular 应用中得全局作用域对象。

3、$scope 的生命周期有4个阶段:

(1)创建:控制器或者指令创建时, Angular 会使用 $injector 创建一个新的作用域,然后在控制器或指令运行时,将作用域传递进去。

(2)链接:Angular 启动后会将所有 $scope 对象附加或者说链接到视图上,所有创建 $scope 对象的函数也会被附加到视图上。 这些作用域将会注册当 Angular 上下文发生变化时需要运行的函数.也就是 $watch 函数, Angular 通过这些函数或者何时开始事件循环。

(3)更新:一旦事件循环开始运行,就会开始执行自己的脏值检测.一旦检测到变化,就会触发 $scope 上指定的回调函数。

(4)销毁:通常来讲如果一个 $scope 在视图中不再需要, 需要对其进行清理。

4、 w a


本文来自互联网用户投稿,文章观点仅代表作者本人,不代表本站立场,不承担相关法律责任。如若转载,请注明出处。 如若内容造成侵权/违法违规/事实不符,请点击【内容举报】进行投诉反馈!

相关文章

立即
投稿

微信公众账号

微信扫一扫加关注

返回
顶部