如何使用AngularJS访问浏览器控制台中的$ scope变量？
我想在Chrome的JavaScript控制台中访问我的$scope变量。 我怎么做？
我不能在控制台中看到$scope或模块myapp的名称作为变量。
在开发人员工具的HTML面板中选择一个元素，然后在控制台中输入：
angular.element($0).scope()
在WebKit和Firefox中， $0是对元素选项卡中所选DOM节点的引用，因此通过执行此操作可以在控制台中打印出所选DOM节点作用域。
您也可以通过元素ID来定位范围，如下所示：
angular.element(document.getElementById('yourElementId')).scope()
插件/扩展
您可能想要查看一些非常有用的Chrome扩展程序：
Batarang。 这已经有一段时间了。
NG-检查。 这是最新的，顾名思义，它允许您检查应用程序的范围。
玩jsFiddle
使用jsfiddle时，您可以在显示模式下通过在URL末尾添加/show来打开小提琴。 像这样运行时，您可以访问angular全局。 你可以在这里尝试：
http://jsfiddle.net/jaimem/Yatbt/show
jQuery Lite
如果你在AngularJS之前加载jQuery， angular.element可以传递一个jQuery选择器。 所以你可以用一个检查控制器的范围
angular.element('[ng-controller=ctrl]').scope()
一个按钮
angular.element('button:eq(1)').scope()
... 等等。
您可能实际上想要使用全局函数来简化它：
window.SC = function(selector){
return angular.element(selector).scope();
};
现在你可以做到这一点
SC('button:eq(10)')
SC('button:eq(10)').row // -> value of scope.row
在这里检查：http://jsfiddle.net/jaimem/DvRaR/1/show/
为了改善jm的回答...
// Access whole scope
angular.element(myDomElement).scope();
// Access and change variable in scope
angular.element(myDomElement).scope().myVar = 5;
angular.element(myDomElement).scope().myArray.push(newItem);
// Update page to reflect changed variables
angular.element(myDomElement).scope().$apply();
或者，如果您使用的是jQuery，它也会做同样的事情......
$('#elementId').scope();
$('#elementId').scope().$apply();
从控制台访问DOM元素的另一个简单方法是（在jm中提到），在'元素'选项卡中单击它，它会自动以$0形式存储。
angular.element($0).scope();
如果你已经安装了Batarang
然后你可以写：
$scope
当你在chrome元素视图中选择元素时。 参考 - https://github.com/angular/angularjs-batarang#console
链接地址: http://www.djcxy.com/p/13585.html上一篇: How do I access the $scope variable in browser's console using AngularJS?