$ scope不在控制台上工作

Question

关于范围的AngularJS开发人员指南说我们可以通过在控制台上键入$ scope来检查范围。

  

检查调试器中的范围：

     

1.右键单击浏览器中感兴趣的元素，然后选择   ＆＃39;检查元素＆＃39;。你应该看到浏览器调试器   你点击的元素突出显示。

     

2.调试器允许您访问当前选中的元素   控制台为$ 0变量。

     

3.在控制台执行中检索关联的范围：   angular.element（$ 0）.scope（）或只输入$ scope

但是当我在控制台上键入$ scope时，它说

  

未捕获的ReferenceError：未定义$ scope       at：1：1

以下是link供参考。

app.js看起来像这样

var app=angular.module("app",[]);
app.controller("ctrl",['$scope','demoservice',function($scope,demoservice){
  console.log(demoservice);
  $scope.ser=demoservice;
}]);

app.service("demoservice",[function (){
  this.name="Himanshu";
}]);

有人要求代码，所以这里是CodePen，其中会出现同样的错误。

Answer 1

$ scope是控制器内部的引用变量，因此在控制台上编写$ scope将不提供访问权限，因为它不是全局变量，而是作用域的私有变量。因此，如果您需要访问$ scope变量，您需要在某个执行范围内访问它，请考虑以下示例

断点一直保存在执行内容的中间，所以现在这里为$ scope在内存中我们可以在控制台中使用它

因此，为了检查$ scope，你必须处于执行的中间，或许不仅仅是$ scope，但这适用于任何js代码变量，除非它的全局不能在窗口控制台中访问。

除了使用更友好的角度JS调试之外，您还可以使用angular batarang添加到chrome

Answer 2

从HTML中选择一个元素，然后在控制台选项卡中执行angular.element($0).scope();这个语句，您将获得该元素的范围。

或

您可以安装in-inspect chrome插件。并使用$s  在控制台中获取元素的范围。