VIDEO – F12 Trick to Peek at AngularJS Scope

Wanted to share trick for peeking into AngularJS scope with F12 tools and DOM selector.   After selecting any HTML DOM element you can “peek” into the “$scope” with variables available at that level.   No special browser extension or plug-ins needed.   If debugging AngularJS frequently check out Batarang for more advanced browser F12 tools.  For a quick check be sure to memorize “angular.element($0).scope()” for typing into console.   Realize that Angular (2+) has superseded AngularJS 1x.   However, many AngularJS applications continue to need support.   Tricks like this make that work easy.

Cheers

Code

angular.element($0).scope()

Video

References

• https://stackoverflow.com/questions/13743058/how-do-i-access-the-scope-variable-in-browsers-console-using-angularjs
• https://chrome.google.com/webstore/detail/angularjs-batarang/ighdmehidhipcmcojjgiloacoafjmpfk