AngularJS --- Scope

Posted 2020-09-09

scope（作用域）是应用在 html（视图）和 javascript（控制器）之间的纽带。

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

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

Scope 是模型。

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

 1      <div ng-app="myApp" ng-controller="myCtrl">
 2           <input ng-model="name">
 3           <h1>{{greeting}}</h1>
 4           <button ng-click="sayHello()">点我</button>
 5      </div>
 6      <script>
 7           var app = angular.module(‘myApp‘,[]);
 8           app.controller(‘myCtrl‘,function($scope){
 9                $scope.name="zhouli";
10                $scope.sayHello = function(){
11                     $scope.greeting = ‘Hello ‘ + $scope.name + ‘!‘;
12                };
13           });
14      </script>

 

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

 

 1      <div ng-app="myApp" ng-controller="myCtrl">
 2           <h1>{{lastName}}</h1>
 3           <ul>
 4                <li ng-repeat="x in names">{{x}} {{lastName}}</li>
 5           </ul>
 6      </div>
 7      <script>
 8           var app = angular.module(‘myApp‘,[]);
 9           app.controller(‘myCtrl‘,function($scope,$rootScope){
10                $scope.names = [‘Email‘,‘Tobias‘,‘Linus‘];
11                $rootScope.lastName = ‘Refsnes‘;
12           });
13      </script>