Inspector pane for AngularJS apps
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.
The extension adds a button next to the address bar with the Angular logo that toggles the pane on and off.
Please submit bug reports and suggestions at the GitHub repo: https://github.com/rev087/ng-inspector/issues/
Latest reviews
- (2021-01-25) Suong Liang: Awesome. It's easier to view compared to the plugins I tried
- (2020-04-09) Sean Haddy: It works pretty well for angular inspection BUT if you're launching a local web server, you can get connection issues after first inspection. The angular lookup ties up server resources upon inspection, and doesn't release once the browser session is dropped. This can be very bad for memory usage as well as, many environments will fail to start up after second session launch. You have to disable every time you want to launch a new debug session.
- (2020-03-02) Fabian Picone: Not showing any scope
- (2019-10-26) Patrick Lieberherr: Unfortunately, the chrome tab crashes sometimes when the extension is open
- (2019-10-01) Daniel Jackson: Push button, nothing happens :(
- (2018-12-19) Chris Olsen: Impossible to find the element's scope that you are looking for and the UI overlays the right side of your page, making it almost impossible to use.
- (2018-12-14) 汪滔: 还可以,就是因为刚刚在用的时候是vscode打开的,所以用不上,这个插件必须以网络协议打开,不能以文件协议打开页面,如果同样是vscode撸的代码,解决方案是:在vscode的扩展商店中下载Live Server,然后次插件才能有用!!!
- (2018-10-03) xue jin: 说一下,这个工具有点很明显,可以显示不同作用域里面的自定义属性和方法,和其他的插件不同的是,其他的插件会显示不同作用域里面的所有属性和方法,对于初学者而言从一个包含所有系统属性作用域中找有没有自己的属性很麻烦,这个工具筛选出了自定义的属性,很好,另外,刚开始我用vscode在浏览器中打开html页面点击这个工具无效,摸索了好久,才发现必须在web服务器中才能打开这个工具,也就是访问自己编写的页码的url不能是file://D盘/test这样的地址,而必须是服务的形式,http://127.0.0.1:8080/test这样的形式,否则无效,另外,还有一点,每次刷新页面就必须把这个工具从新点一遍,很是麻烦,写下来给以后的人参考使用,初次使用有的时候真实不知道问题出在哪里,好在我是个热心人
- (2018-08-01) Paul Green: Locks up my browser and maxes CPU
- (2018-06-15) W Wesley: this extension looks amazing & helpful, but pity part is that my whole ng1 web app turned to very very slow while i using this extension, hope this would be fixed.
- (2017-11-22) Wouter: Doesn't seem to work?
- (2017-11-07) Ali Gökay Duman: didn't work Angular:4/ubuntu 16.04/chrome:latest
- (2017-10-31) Scott Blanch: Won't show up in console.
- (2017-09-12) Kyle Harrison: Love this tool, or well I did anyways One thing that's slaying me right now is that the CSS seems off in it. Field names are white against a white background. I'm required to hover over the item in the list to see the field name :\
- (2017-07-07) Artem Novikov: Ужасно тормозит.
- (2017-06-28) could not dev without!
- (2017-06-13) Luke Legrand: Nothing appears when I click the button...
- (2017-05-08) John Grant: Cannot read property '$root' of undefined
- (2017-04-23) Duncan Gossage: It didn't work Version 58.0.3029.81 (64-bit) Windows 10 I didn't dislike it, I was just disappointed. However, suddenly it worked. The only difference I could see was that instead of double clicking my index.html page into Chrome. I actually opened my application from a localhost port. So there you go, serve it to some sort of localhost and you can use this...
- (2017-04-19) Yoon Tylor: well done, very useful
- (2017-03-10) gradin Cronos: clicking the icon on the address bar does not show the console
- (2017-02-26) Daniel N.: Not working.
- (2017-02-20) mohammad alraoosh: Best angular inspector,
- (2017-02-17) Jeff Roylance: Almost perfect!!! The one tweak needed(IMO) would be for the extension to not coverup the webpage :-) Overall though, it really is far better than anything else out there for angular debugging. Great Work!!!
- (2017-02-16) Clairton Luz: it's good but it's not show me form.name.$error and form.$valid and this is what I need.
- (2017-02-09) Old Whovian: Doesn't work.
- (2017-01-31) Ali Raza: It is not working in Chrome. Every time I click the extension icon in the menu bar it just stay still and does not do anything. If there's a bug it needs to be fixed.
- (2017-01-20) Anant Anand Gupta: This is really nice tool you get 5 stars for that. the only thing which is a problem for me is that it somehow breaks the google analytics site if it is enabled, so i have to disable this plugin when i have to visit google analytics. https://goo.gl/photos/wnrnUjEcBaZBGWYu6 A star is taken away because of that.