我如何访问$范围变量在浏览器的控制台使用AngularJS?

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

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

当前回答

要添加和增强其他答案，在控制台中输入$($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代码的提示和技巧。

其他回答

同样，我们可以像这样通过HTML元素的名称来访问作用域: angular.element (document.getElementsByName (onboardingForm) [0]) .scope ()

在控制器的某个地方(通常最后一行是一个好地方)，放置

console.log($scope);

如果你想查看内部/隐式作用域，比如ng-repeat的内部，类似这样的方法可以工作。

<li ng-repeat="item in items">
   ...
   <a ng-click="showScope($event)">show scope</a>
</li>

然后在控制器中

function MyCtrl($scope) {
    ...
    $scope.showScope = function(e) {
        console.log(angular.element(e.srcElement).scope());
    }
}

注意，上面我们在父作用域中定义了showScope()函数，但这是可以的…子/内部/隐式作用域可以访问该函数，然后该函数根据事件打印出作用域，从而打印出与触发事件的元素关联的作用域。

@jm-的建议也工作，但我不认为它在jsFiddle工作。我得到这个错误在jsFiddle在Chrome:

> angular.element($0).scope()
ReferenceError: angular is not defined

出于调试的目的，我把它放在控制器的开头。

   window.scope = $scope;

  $scope.today = new Date();

我是这样使用它的。

然后删除它，当我完成调试。

如果你已经安装了Batarang

然后你可以这样写:

$scope

当你在chrome的元素视图中选择了元素。参考- https://github.com/angular/angularjs-batarang#console

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

.scope angular.element () ();

例子:

推荐文章