Last Updated: February 25, 2016
·
8.299K
· bertrand

Access angularJS scope in browser console

1.
In your Dev Tools browser, select the element that contain your ng-controller property.

2.
Switch to the console and write:
scope = angular.element($0).scope()

3.
Do what you want like:
scope.$apply(function() { scope.myVar= "home"; })

Works in Chrome/Safari/FF

source:
http://www.youtube.com/watch?v=Klqn73uzQao

3 Responses
Add your response

Pretty nice tip, however maybe you would like to take a look to Batarang, a Chrome extension to debug AngularJS applications.

https://github.com/angular/angularjs-batarang

over 1 year ago ·

hi elecash,
i tried Batarang few weeks ago, good extension but i was unable to interact with my angular app..
I don't know if it was the normal behavior or a bug because it's a young extension.

over 1 year ago ·

This is a nice tip, but a bit of a process. batarang seems to still have mixed reviews on the chrome dev store. I just downloaded ng-inspect, a firefox extension, and while I only just grabbed it, it seems to do this same thing loads faster.

Just, for anyone else who ends up here through google like I did.

over 1 year ago ·