AngularJS 作用域（Scope）

AngularJS作用域（Scope）

Scope作用域是应用在视图和控制器之间的纽带，Scope是一个对象包含可用的方法和属性，Scope可以应用在试图和控制器上。

$scope是针对当前的controller的作用域生效

$rootScope是针对全局controller的作用域生效

下面使用代码进行这个作用域的演示

 1 <html>
 2 <head>
 3     <title>AngularJS作用域</title>
 4     <meta charset="utf-8" /> 
 5     <script src="js/angular.min.js"></script> 
 6     <style>
 7         .frame { 
 8         height:250px;
 9         border:1px solid black;
10         background-color:lightblue;
11         padding:10px;
12         margin:20px;
13         }
14 
15     </style>
16 </head>
17 <body ng-app="myApp">
18     <div class="frame" ng-controller="oneController">
19         scope1 :{{scope1}}<br />
20         rootScope1: {{rootScope1}}<br />
21         scope2 :{{scope2}}<br />
22         rootScope2 :{{rootScope2}}<br />
23     </div>
24 
25     <div class="frame" ng-controller="towController">
26         scope1 :{{scope1}}<br />
27         rootScope1: {{rootScope1}}<br />
28         scope2 :{{scope2}}<br />
29         rootScope2 :{{rootScope2}}<br />
30     </div>
31    
32     <script>
33         var app = angular.module("myApp", []);
34         app.controller("oneController", function ($scope,$rootScope) {
35             $scope.scope1 = "我是scope1";
36             $rootScope.rootScope1 = "我是rootScope1";
37         })
38         app.controller("towController", function ($scope, $rootScope) {
39             $scope.scope2 = "我是scope2";
40             $rootScope.rootScope2 = "我是rootscope2";
41         })
42     </script>
43 </body>
44 </html>

 

posted @ 2017-04-14 15:01  Ｗǒ々啊申々  阅读(201)  评论(0)  编辑  收藏  举报