1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 <title>作用域的讲解</title> 6 <script src="../bower_components/angular/angular.min.js"></script> <!-- 引入angular --> 7 </head> 8 <body ng-app="app"> 9 {{haha}} 10 <div ng-controller="ctrl"> <!-- 控制器ctrl --> 11 {{name}} <!-- 这里为小潘 --> 12 {{age}} <!-- 这里为200 --> 13 {{haha}} <!-- 这里为 鸣人 --> 14 </div> 15 <div ng-controller="ctrl2"> <!-- 控制器ctrl2 --> 16 {{name}} <!-- 这里为小西 --> 17 {{age}} <!-- 这里为188 --> 18 {{haha}} <!-- 这里为鸣人 --> 19 </div> 20 <script> 21 // var obj = {} 22 // obj.name = 'ddd'; 23 // console.log(obj.name) 24 // console.log(age) 25 //定义 app模块 26 angular.module('app',[]) /*先找到模块 app*/ 27 .controller('ctrl',function($scope,$rootScope){ /* 找到控制器ctrl*/ 28 $scope.name="小潘！" 29 $scope.age = 200; /*它的作用域仅限于ctrl控制器的那一部分*/ 30 $rootScope.haha = '鸣人！'; /*它的作用域是为全局的*/ 31 }) 32 33 .controller('ctrl2',["$scope",function($scope){ //不同的写法，第二个参数是一个数组 34 $scope.name = '小西'; 35 $scope.age = 188; 36 }]) 37 38 </script> 39 40 </body> 41 </html>