问题描述
我想访问我的 $范围
变量在Chrome的JavaScript控制台。我该怎么做呢?
I would like to access my $scope
variable in Chrome's JavaScript console. How do I do that?
我既看不到 $范围
,也没有我的控制台作为变量模块的myapp 的名称。
I can neither see
$scope
nor the name of my module myapp
in the console as variables.
推荐答案
在的开发工具的HTML面板选择的元素,并在控制台中输入:
Pick an element in the HTML panel of the developer tools and type this in the console:
angular.element($0).scope()
在,
$ 1,0
是所选择的一个参考在元素标签DOM节点,所以做这个你在控制台打印出所选择的DOM节点范围。
In WebKit,
$0
is a reference to the selected DOM node in the elements tab, so by doing this you get the selected DOM node scope printed out in the console.
您还可以通过定位元素ID范围,像这样:
You can also target the scope by element ID, like so:
angular.element(document.getElementById('yourElementId')).scope()
扩展中心/扩展
有,你可能想看看一些非常有用的Chrome扩展:
There are some very useful Chrome extensions that you might want to check out:
-
Batarang.这已经有一段时间了。
Batarang. This has been around for a while.
。这是最新的一个,顾名思义,它可以让你检查你的应用程序的范围。
ng-inspector. This is the newest one, and as the name suggests, it allows you to inspect your application's scopes.
用的jsfiddle播放
在使用的jsfiddle您可以通过添加
/节目
在网址的结尾中的显示的模式打开小提琴工作。当这样运行,您有机会获得角
全球。你可以在这里尝试一下:
When working with jsfiddle you can open the fiddle in show mode by adding
/show
at the end of the URL. When running like this you have access to the angular
global. You can try it here:
jQuery的精简版
如果您AngularJS之前加载了jQuery,
angular.element
可以传递一个jQuery选择。所以,你可以用检查控制器的范围
If you load jQuery before AngularJS,
angular.element
can be passed a jQuery selector. So you could inspect the scope of a controller with
angular.element('[ng-controller=ctrl]').scope()
按钮
angular.element('button:eq(1)').scope()
...等
您也许真的想用一个全局函数,使其更容易:
You might actually want to use a global function to make it easier:
window.SC = function(selector){
return angular.element(selector).scope();
};
现在,你可以做到这一点。
Now you could do this
SC('button:eq(10)')
SC('button:eq(10)').row // -> value of scope.row
查看此处:
这篇关于如何访问使用AngularJS在浏览器的控制台中的$范围的变量?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!