Best IT Recipes

How to debug $ rootScope angularjs object in browser

Is there any way to debug an angularjs application when it is loaded in a browser?

T. I want to get $rootScope my current application. How should I do it?

+63
javascript angularjs
Nov 01
source share
6 answers

+1 for Batarang

In addition, you can get the scope from any element in the DOM by following these steps from the console

 angular.element(DOMNODE).scope()

Where is DOMNODE, of course, a link to the DOM node.

For example, in Chrome, on the elements tab , you can select the node where the ng-app directive is specified and get the root area with

 angular.element($0).scope()
+69
Nov 01 '12 at 6:30
source share

In the developer console, try

 $rootScope = angular.element(document).scope()
+29
Aug 01 '14 at 15:24
source share

Batarang - Google Chrome Plugin for AngularJS

After that you can do

console.log ($ rootScope);

and check the scope object in the Chrome console.

By the way, if you want to get $ rootScope, you need to enter your controller

as

 app.controller('MainCtrl', function($scope, $rootScope) { }
+14
Nov 01
source share

You can see $ rootScope in your sources. Developer Tools → Sources

$ rootScope

+3
Mar 04 '15 at 12:02
source share

I just wanted to add that there is a free Chrome extension called "Angular Scope Inspector" (the current URL of the store ), which will automatically check the area of ​​the selected elements on the toolbar of the developer tools

I just opened it today and it is very useful, IMO

+2
Sep 23 '14 at 19:07
source share

In the developer console, type angular.element('body').scope(); in case of your application <body data-ng-app="SomeApp">

0
Dec 24 '15 at 18:46
source share


More articles:


All Articles