如何使用AngularJS访问浏览器控制台中的$Scope变量？

Question

如何使用AngularJS访问浏览器控制台中的$Scope变量？我想进入我的$scope变量在Chrome的JavaScript控制台中。我该怎么做？我都看不见$scope也不知道我的模块名myapp在控制台中作为变量。

Answer 1

为了提高JM的回答.。

// Access whole scopeangular.element(myDomElement).scope();
// Access and change variable in scopeangular.element(myDomElement).scope().myVar = 5;angular.element(myDomElement).scope().
myArray.push(newItem);// Update page to reflect changed variablesangular.element(myDomElement).scope().$apply();

或者如果你在使用jQuery，它也会做同样的事情.

$('#elementId').scope();$('#elementId').scope().$apply();

从控制台访问DOM元素的另一种简单方法(如JM所述)是在“Elements”选项卡中单击它，它将自动存储为$0.

angular.element($0).scope();

Answer 2

这是在没有Batarang的情况下获得范围的一种方法，您可以这样做：

var scope = angular.element('#selectorId').scope();

或者，如果要按控制器名称查找作用域，请执行以下操作：

var scope = angular.element('[ng-controller=myController]').scope();

对模型进行更改后，需要通过调用以下命令将更改应用于DOM：

scope.$apply();