What is Ng-Inspector?
ng-inspector is a browser extension that displays an inspector panel showing the AngularJS scope hierarchy in the current page in real time, as well as which controllers or directives are associated with which scope.
Hovering over a scope in the inspector will highlight the DOM element that scope is attached to. Clicking on a model will console.log that model's contents.
Features:
Scopes
See whole scope hierarchy in your AngularJS application. Click on the scopes in the pane to console.log their assigned DOM Nodes.
DOM highlighting
As you mouse-over the scopes in the pane, their DOM nodes are highlighted in the page.
Controllers, directive
ng-inspector identifies and displays along with each scope the Controllers and Directives that triggered its creation.
Models
See all the scope’s models, their types and values. Click the model to console.log their values.
Real time
As you interact with your application, ng-inspector updates everything in real time.
Video for Inspector
