如何理解rootScope？

我正在學習angularjs。當我學習範圍時，我會看到rootScope。但我真的不明白它是什麼。如何理解rootScope？

例如：

<!DOCTYPE html> 
 
<html> 
 
<head> 
 
<meta charset="utf-8"> 
 
<script src="https://cdn.static.runoob.com/libs/angular.js/1.4.6/angular.min.js"></script> 
 
</head> 
 
<body> 
 

 
<div ng-app="myApp" ng-controller="myCtrl"> 
 

 
<h1>Family Name {{lastname}} Members:</h1> 
 

 
<ul> 
 
    <li ng-repeat="x in names">{{x}} {{lastname}}</li> 
 
</ul> 
 

 
</div> 
 

 
<script> 
 
var app = angular.module('myApp', []); 
 

 
app.controller('myCtrl', function($scope, $rootScope) { 
 
    $scope.names = ["Emil", "Tobias", "Linus"]; 
 
    $rootScope.lastname = "Refsnes"; 
 
}); 
 
</script> 
 

 
</body> 
 
</html>

但我不明白什麼是下面的代碼之間的區別：

<!DOCTYPE html> 
 
<html> 
 
<head> 
 
<meta charset="utf-8"> 
 
<script src="https://cdn.static.runoob.com/libs/angular.js/1.4.6/angular.min.js"></script> 
 
</head> 
 
<body> 
 

 
<div ng-app="myApp" ng-controller="myCtrl"> 
 

 
<h1>Family Name {{lastname}} Members:</h1> 
 

 
<ul> 
 
    <li ng-repeat="x in names">{{x}} {{lastname}}</li> 
 
</ul> 
 

 
</div> 
 

 
<script> 
 
var app = angular.module('myApp', []); 
 

 
app.controller('myCtrl', function($scope) { 
 
    $scope.names = ["Emil", "Tobias", "Linus"]; 
 
    $scope.lastname = "Refsnes"; 
 
}); 
 
</script> 
 

 
</body> 
 
</html>

因此，如果作用域和rootScope之間沒有區別，爲什麼我們需要使用rootScope？

我希望有人能給我一個簡單的例子，以便我可以很容易地理解rootScope。

來源

2017-02-17 hellozjf

每個應用程序都有一個single根作用域。所有其他作用域都是根作用域的後代作用域。範圍通過觀察模型變化的機制提供模型和視圖之間的分離。他們還提供活動排放/廣播和訂閱設施。

更多信息here。

然而，一個非常簡單的解釋是考慮rootScope和所有子範圍的原始父項。如果您想象一個層次結構，rootScope就位於頂層。

我的例子中沒有涉及到rootScope，它只是一個perent範圍。因此，您的父範圍中有一個lastname，並且由於ng-repeat創建了一個子範圍，所以它們中的每個人也都有一個lastname。

來源

2017-02-17 03:07:04 Yaser

我想添加到@Yaser的答案。我將使用谷歌瀏覽器控制檯來解釋$rootScope層次結構，該層次結構由整個網頁中的所有範圍繼承。

步驟1：打開Chrome網上應用的開發工具，並與ng-app = "myApp"

步驟2選擇div：轉到Chrome網上應用開發工具的控制檯，然後輸入angular.element($0).scope()，這會爲你抓取含有$rootScope細節的對象。

在這裏，你會發現一個屬性名字：「的Refsnes」

第3步：轉到元素標籤，然後選擇<li>

步驟4中的一個：在控制檯類型angular.element($0).scope() ，這將獲取包含選定範圍的詳細信息的您和對象

展開父級屬性，您將fin d rootScope的財產名字：「的Refsnes」

這應解釋如何$rootScope由網頁

來源

2017-02-17 03:58:41

的$ rootScope上的所有其他範圍繼承是最頂層的範圍。應用程序只能有一個$ rootScope，它將在應用程序的所有組件之間共享。因此它就像一個全局變量。所有其他$作用域都是$ rootScope的子作用域。

var app = angular.module('myApp', []); 
 

 
app.controller('Ctrl1', ['$scope','$rootScope', function ($scope,$rootScope) { 
 
    
 
    $rootScope.name = "Rahul"; 
 
}]); 
 

 
app.controller('Ctrl2', ['$scope','$rootScope', function ($scope,$rootScope) { 
 
    $scope.name = $rootScope.name; 
 
}]);

<!DOCTYPE html> 
 
<html lang="en-US" ng-app="myApp"> 
 
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script> 
 
<body> 
 

 
<div> 
 
    
 
<div ng-controller="Ctrl1"> 
 
    <span>{{name}}</span> - controller -1 
 
</div> 
 
<hr> 
 
<div ng-controller="Ctrl2"> 
 
    <span>{{name}}</span> - controller -2  
 
</div> 
 
</div> 
 

 
</body> 
 
</html>

變種應用= angular.module（ '對myApp'，[]）[此處輸入圖像的描述] [1] //這裏rootScope創建只有一個時間

檢查結構鏈接： - https://i.stack.imgur.com/rzBj3.png

這裏是一個簡單的使用rootScope作爲從一個控制器傳遞數據到另一個控制器

來源

2018-01-02 07:04:45

如何理解rootScope？

回答

相關問題