節選官方文檔:
原文:https://docs.angularjs.org/guide/scope
scope是附加在DOM上,使用了ng-app指令的DOM就是root scope。一般是<html ng-app="app">或body元素
如果要查看某個DOM附加的scope信息,可以按下面的步驟:
1. 打開chrome的調試面板右鍵元素,選擇檢查
2. 在console面板中輸入$0並回車,可以顯示當前所選的元素。
3. 獲取附加在他上面的scope信息。執行angular.element($0).scope() 或 僅輸入 $scope
額外多說一句,建議開發時利用這個特性。在線上環境可能會失效。具體見這里。
附上原文,總之多看官網文檔能收獲很多。
Retrieving Scopes from the DOM.
Scopes are attached to the DOM as $scope
data property, and can be retrieved for debugging purposes. (It is unlikely that one would need to retrieve scopes in this way inside the application.) The location where the root scope is attached to the DOM is defined by the location of ng-app
directive. Typically ng-app
is placed on the <html>
element, but it can be placed on other elements as well, if, for example, only a portion of the view needs to be controlled by Angular.
To examine the scope in the debugger:
-
Right click on the element of interest in your browser and select 'inspect element'. You should see the browser debugger with the element you clicked on highlighted.
-
The debugger allows you to access the currently selected element in the console as
$0
variable. -
To retrieve the associated scope in console execute:
angular.element($0).scope()
or just type $scope