controller 中,如果局部 $scope 和 $rootScope 都存在,且有相同名字的变量,{{变量名}} 指局部变量而不是全局变量,作用域只有当前 controller;{{$root.变量名}} 是全局变量,在 ng-app="" 下任何一个 controller 中都能使用。如果没有 $scope, 只有 $rootScope,那么 {{变量名}} 和 {{$root.变量名}} 就没区别了。
<body ng-app="myApp">
<div ng-controller="myCtrl"> //输出结果
{{first}}<br> //ctrl局部first
{{$root.first}}<br> //全局first
{{second}}<br> //全局second
{{$root.second}}<br> //全局second
</div>
<br>
<br>
<div ng-controller="myCtrl2">
{{first}}<br> //全局first
{{$root.first}}<br> //全局first
{{second}}<br> //ctrl2局部second
{{$root.second}} //全局second
</div>
<script>
var app = angular.module('myApp', []);
app.controller('myCtrl', function ($scope,$rootScope) {
$scope.first = 'ctrl局部first';
$rootScope.first = '全局first';
});
app.controller('myCtrl2', function ($scope,$rootScope) {
$scope.second = 'ctrl2局部second';
$rootScope.second = '全局second';
});
</script>