AngularJS的作用域Scope

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了AngularJS的作用域Scope相关的知识,希望对你有一定的参考价值。

 

1.简介

       angularjs启动并生成视图时,会根据ng-app元素和$RootScope进行绑定。$RootScope是所有$scope对象的最上层,是angularjs中最接近于全局作用域的对象。

       $scope对象就是一个普通的javascript对象,在angularjs中充当数据模型,但与传统的数据模型又不一样,$scope并不负责处理和数据操作,它只是视图和html之间的桥梁。

       $scope的所有属性都可以自动被视图访问到。

       作用域是构成AngularJS应用的核心,它与应用的数据模型相关联,同时也是表达式执行的上下文。作用域包含了渲染视图所需的功能和数据,它是所有视图的唯一源头,可以将作用域理解成视图模型。 

  $scope对象是定义应用业务逻辑、控制器方法和视图属性的地方。angularjs将$scope设计成和DOM类似的结构,因此$scope可以进行嵌套,也就是说我们可以引用父级$scope中引用父级$scope中的属性和方法。

 

2.作用域功能

  • 提供观察者以监视数据模型的变化。
  • 可以将数据模型的变化通知给整个应用,设置是系统外的组件。
  • 可以进行嵌套,隔离业务功能和数据。
  • 给表达式提供运算时所需的执行环境。

3.会创建子作用域的指令

  AngularJS中大部分指令不会创建子作用域,但是以下指令例外,开发时必须注意作用域嵌套的相关问题,否则很容易出错。

  • ng-include 
    创建一个新的子作用域,并且会继承父作用域。
  • ng-switch 
    创建一个新的子作用域,并且会继承父作用域。
  • ng-repeat 
    为每一个item都创建一个子作用域,全部都会继承父作用域。
  • ng-controller 
    创建一个新的作用域,并且会继承父作用域

4.$scope生命周期

  $scope对象的生命周期处理有四个不同阶段,分别是创建,链接,更新和销毁。  

      创建

  在创建控制器或指令时,AngularJS会用$injector创建一个新的作用域,并在这个新建的控制器或指令运行时将作用域传递进去。

      链接

  当Angular开始运行时,所有的$scope对象都会附加或者链接到视图中。所有创建$scope对象的函数也会将自身附加到视图中。这些作用域将会注册当Angular应用上下文中发生变化时所需要运行的函数。这些函数被称为$watch函数,Angular通过这些函数获知何时启动时间循环。

       更新

  当事件循环运行时,它通常执行在$rootScope上。每个子作用域都执行自己的脏值检测,每个监控函数都会检查变化。如果检测到任意变化,$scope对象就会触发指定的回调函数。

     销毁

  当一个$scope在视图中不再需要时,这个作用域将会清理和销毁自己。(基本上不会需要你来清理作用域,但是你还是可以使用$scope上的$destroy()方法来清理作用域)。





以上是关于AngularJS的作用域Scope的主要内容,如果未能解决你的问题,请参考以下文章

AngularJS中的父作用域与自作用域

AngularJS 指令的 Scope (作用域)

AngularJS 指令的 Scope (作用域)

angularJs指令的Scope(作用域)

构建自己的AngularJS - 作用域和Digest

angularjs作用域之transclude