zoukankan      html  css  js  c++  java
  • 第4章 作用域

    视图和$scope的世界

      AngularJS启动后并生成视图,会将ng-app同$rootScope进行绑定。$rootScope是所有$scope对象的顶层。相当于某一个ng-app的全局作用域。$scope对象只充当数据模型,不作处理和操作数据。

      以下为$rootScope的例子:

      

    <!doctype html>
    <html>
    
        <head>
            <script src="angularJs/1.2.13/angular.js"></script>
        </head>
    
        <body ng-app="myApp">
            <div>
                hello {{name}}
            </div>
    
        </body>
        <script>
            var app = angular.module('myApp', []).run(function($rootScope){
                $rootScope.name="world";
            });
        </script>
    </html>

      上面的的例子在$rootScope中设置了一个name变量,并引用了它。为了避免污染全局命名空间,可以用控制器显式的创建一个隔离的$scope对象,再将变量设置到这个子变量上。使用ng-controller指令可以将一个控制器对象附加到DOM元素上。如下:

      

    <!doctype html>
    <html>
    
        <head>
            <script src="angularJs/1.2.13/angular.js"></script>
        </head>
    
        <body ng-app="myApp">
            <div ng-controller="MyController">
                hello {{name}}
            </div>
    
        </body>
        <script>
            var app = angular.module('myApp', []);
            app.controller("MyController",function($scope){
                $scope.name="Ari";
            })
        </script>
    </html>

    $scope的生命周期

      1.创建

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

       2.链接

       当Angular开始运行时,所有的$scope对象都会附加到视图中。

       3.更新

       当事件循环运行时,通常执行顶层$scope对象,每个子作用域执行自己的脏值检测。检测到变换,就会触发指定的回调函数。

      4.销毁

    指令和作用域

      指令通常不会创建自己的作用域,但ng-controller和ng-repeat指令会创建自己的作用域。

  • 相关阅读:
    java课后作业-4
    课堂练习
    16年9月27日上午
    《大道至简》第二章读后感
    《大道至简》-编程的精义读后感
    用Windbg来看看CLR的JIT是什么时候发生的
    如何调试什么时候SaveFileDialog会被Dispose
    针对C#程序做性能测试的一些基本准则
    要注意null合并运算符的优先级比+还要低
    实现GetHashCode时要遵循的规则
  • 原文地址:https://www.cnblogs.com/wuchaodzxx/p/5618134.html
Copyright © 2011-2022 走看看