作用域

Posted 2020-07-30 且听风吟-wuchao

tags:

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

视图和$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>