我想访问我的$范围变量在Chrome的JavaScript控制台。我怎么做呢?

我既不能看到$scope也不能看到我的模块myapp的名称在控制台中作为变量。


当前回答

检查元素,然后在控制台中使用它

s = $($0).scope()
// `s` is the scope object if it exists

其他回答

我同意最好的是Batarang在选择对象后使用它的$scope(它与angular.element($0).scope()相同,甚至更短的jQuery: $($0).scope()(我的最爱))

同样,如果你像我一样在body元素上有主作用域,那么$('body').scope()就可以了。

在angular中,我们通过angular.element()....获取jquery元素 让c…

.scope angular.element () ();

例子:

<div id=“”></div>

要添加和增强其他答案,在控制台中输入$($0)以获取元素。如果它是一个Angularjs应用程序,则默认加载jQuery精简版。

如果你不使用jQuery,你可以使用angular.element($0)如下:

angular.element($0).scope()

要检查你是否有jQuery和版本,在控制台中运行这个命令:

$.fn.jquery

如果您已经检查了一个元素,那么当前选择的元素可以通过命令行API引用$0获得。Firebug和Chrome都有这个引用。

然而,Chrome开发工具将可用的最后五个元素(或堆对象)选择通过属性命名$0,$1,$2,$3,$4使用这些引用。最近选择的元素或对象可以引用为$0,次近的元素或对象可以引用为$1,依此类推。

下面是Firebug的命令行API引用,它列出了它的引用。

$($0).scope()将返回与元素关联的范围。你可以马上看到它的属性。

你还可以使用其他一些东西:

查看元素的父作用域:

(0)美元.scope()。美元的父母。

你也可以链接这个:

(0)美元.scope()。父母。父母美元

你可以看看根作用域:

(0)美元.scope根。美元()

如果你用隔离作用域高亮显示了一个指令,你可以用:

(0)美元.isolateScope ()

更多细节和示例请参见调试不熟悉的Angularjs代码的提示和技巧。

这也需要安装jQuery,但是非常适合开发环境。它查看每个元素以获得作用域的实例,然后返回带有控制器名称的实例。它还删除了任何以$开头的属性,这是angularjs通常用于配置的属性。

let controllers = (extensive = false) => {
            let result = {};
            $('*').each((i, e) => {
                let scope = angular.element(e).scope();
                if(Object.prototype.toString.call(scope) === '[object Object]' && e.hasAttribute('ng-controller')) {
                    let slimScope = {};
                    for(let key in scope) {
                        if(key.indexOf('$') !== 0 && key !== 'constructor' || extensive) {
                            slimScope[key] = scope[key];
                        }
                    }
                    result[$(e).attr('ng-controller')] = slimScope;
                }
            });

            return result;
        }

只需将$scope赋值为全局变量。问题解决了。

app.controller('myCtrl', ['$scope', '$http', function($scope, $http) {
    window.$scope = $scope;
}

实际上,我们在开发中比在生产中更需要$scope。

@JasonGoemaat已经提到了,但添加它作为这个问题的合适答案。