Angular state inspector

How to install an extension Open in Chrome Web Store

CRX ID

nelkodgfpddgpdbcjinaaalphkfffbem

Description from extension meta

Helps you debug Angular component state. Supports Angular 1/2+/Ivy!

Image from store

Description from store

Angular State Inspector for Angular

Supports all versions of Angular:
- AngularJs
- Angular 2+
- Angular Ivy
- Hybrid apps (AngularJs + Angular)

Extends the Chrome Developer Tools for Angular web apps.
Adds new panel "State" to Elements tab, that displays the state of selected element.
Prints state of selected element in console by calling "$state" variable.
Depending on angular version it can show:
- Component state
- Directives
- Context, like ngForOf or ngIf values
- Event listeners
If they are applicable to the current element.

Angular State Inspector also allows you to modify the values in the "State" panel (double click on value) and from console(e.g. $state.title = 'new value').
To apply changes just call $apply() in console.
See all supported commands in chrome console.

Version 1.4.6:
- Show info message if $ctrl is not available in selected scope.
- Update $state object even if it's not available.
Version 1.4.5:
- [ivy] Show info from ng.getComponent(). If it's null then show OwningComponent state.
Version 1.4.4:
- update extension logo
Version 1.4.3:
- Return result emoji on `$apply()` call
Version 1.4.2:
- Fixed props editing and change detection
Version 1.4.1:
- Print always up to date state in console
Version 1.4:
- Full support angular 9 Ivy api
Version 1.3:
- Added experimental support of Ivy
- Added shortcuts that you can use in console

Latest reviews

Alejandro Panta 2025-04-23: Signal values don't refresh
Eetu Hannula 2024-06-25: Doesn't seem to refresh values unless you select the component again. Otherwise nice.
Christian Townsdin 2024-05-17: Working. May 17th, Chrome 125
Cesar Vargas 2024-04-12: doesnt work anymore on chrome Version 123.0.6312.123
jq fang 2023-12-07: chrome 120.0.6099.71 it is not working, state is empty
inomjon Ismaylov 2023-08-25: As an Angular developer this one is one of the most used and usefull tools for me. I use it almost every working day. Simple yet, VERY POWERFUL extension.
inomjon Ismaylov 2023-08-25: As an Angular developer this one is one of the most used and usefull tools for me. I use it almost every working day. Simple yet, VERY POWERFUL extension.
Martin Spierings 2023-03-21: Nice extension though I would like to disable the console message about state and would rather have it in the state panel as a hint somewhere.
Martin Spierings 2023-03-21: Nice extension though I would like to disable the console message about state and would rather have it in the state panel as a hint somewhere.
Максим Ярош 2022-05-10: Top
Максим Ярош 2022-05-10: Top
Houssam B 2022-05-04: This tool become a part of my daily work to debug and identify easily some root cause
Houssam B 2022-05-04: This tool become a part of my daily work to debug and identify easily some root cause
Oussama Dinia 2021-12-09: Really cool, while the new angular devtools gives you the same view on a separate tab, state inspector lets you browse from the elements tab, while viewing your html. It is also fast and does not slow down anything.
Oussama Dinia 2021-12-09: Really cool, while the new angular devtools gives you the same view on a separate tab, state inspector lets you browse from the elements tab, while viewing your html. It is also fast and does not slow down anything.
Joshua Josephson 2021-09-07: Love it but it still doesn't work for me on chrome93 (M1 chip) so I had to bend over backwards to disallow auto-updates and install 91.
Joshua Josephson 2021-09-07: Love it but it still doesn't work for me on chrome93 (M1 chip) so I had to bend over backwards to disallow auto-updates and install 91.
Radek Jakubowski 2021-08-06: I love it as Angular developer but it suddenly stopped working. I hope fix is going to come soon because it makes development heaven and hell for me.
Radek Jakubowski 2021-08-06: I love it as Angular developer but it suddenly stopped working. I hope fix is going to come soon because it makes development heaven and hell for me.
hungitk50 2021-07-28: Nice tool for me when debugging. thanks for your effor FYI...as another one reported, latest chrome updated(Version 92.0.4515.107 (Official Build) (64-bit)) is show empty state.
hungitk50 2021-07-28: Nice tool for me when debugging. thanks for your effor FYI...as another one reported, latest chrome updated(Version 92.0.4515.107 (Official Build) (64-bit)) is show empty state.
Roman Alesenkov 2021-07-26: It worked perfectly until I updated Chrome from Version 91 to Version 92.0.4515.107 (Official Build) (x86_64) on MacOS. Could you fix it somehow?
Roman Alesenkov 2021-07-26: It worked perfectly until I updated Chrome from Version 91 to Version 92.0.4515.107 (Official Build) (x86_64) on MacOS. Could you fix it somehow?
Justin W 2021-07-02: Very handy. Eliminates the need for many debugging breakpoints and console.log statements.
Justin W 2021-07-02: Very handy. Eliminates the need for many debugging breakpoints and console.log statements.
Fabien Mairesse 2021-04-16: Much more reliable, efficient and useful than Augury.
Fabien Mairesse 2021-04-16: Much more reliable, efficient and useful than Augury.
David Marshall 2021-04-01: I was thinking of writing something like this because I was disspointed by Augury. But this is perfect. Thanks a lot !
David Marshall 2021-04-01: I was thinking of writing something like this because I was disspointed by Augury. But this is perfect. Thanks a lot !
Andrei Vodeniktov 2021-02-23: Super usefull. Every Angular developer should have it. One wish if we can we make it work with source maps on prod builds. That would totally rock.
Andrei Vodeniktov 2021-02-23: Super usefull. Every Angular developer should have it. One wish if we can we make it work with source maps on prod builds. That would totally rock.
Jakub 2021-02-10: So far so good, actually works unlike Augury.
Jakub 2021-02-10: So far so good, actually works unlike Augury.
Jelle Bruisten 2021-02-09: Nice inspector nothing else to add
Jelle Bruisten 2021-02-09: Nice inspector nothing else to add
Vlad Pintea-Gärtner 2021-02-02: works smoother than augury, lean and nice.
Vlad Pintea-Gärtner 2021-02-02: works smoother than augury, lean and nice.
Joseph Gabriel 2021-01-13: Works good, but works only for Angular app running in development mode.
Joseph Gabriel 2021-01-13: Works good, but works only for Angular app running in development mode.
SANDEEP AGRAWAL 2020-11-30: I do not see any 'State' panel in the Element tab for the chrome "Version 86.0.4240.198" for my angular app loaded in the page. I think the extension is only compatible with some older versions of the browser.
SANDEEP AGRAWAL 2020-11-30: I do not see any 'State' panel in the Element tab for the chrome "Version 86.0.4240.198" for my angular app loaded in the page. I think the extension is only compatible with some older versions of the browser.
Tin Nguyen 2020-11-19: Simple, fast, usefull.
Tin Nguyen 2020-11-19: Simple, fast, usefull.
Konstantinos Tsangopoulos 2020-10-13: At last! I cannot believe that this actually works, and it's actually fast! Really simple but that's what devs need AFAIAC... Thank you so much you beautiful people!!! :D
Konstantinos Tsangopoulos 2020-10-13: At last! I cannot believe that this actually works, and it's actually fast! Really simple but that's what devs need AFAIAC... Thank you so much you beautiful people!!! :D
Jacek Sochacki 2020-10-01: I works fine, but unfortunately not all state changes are visible in real time
Jacek Sochacki 2020-10-01: I works fine, but unfortunately not all state changes are visible in real time
Maxim Afanasev 2020-09-16: Great tool!
Maxim Afanasev 2020-09-16: Great tool!
Greg Nielsen 2020-07-23: This makes debugging so much easier! Thank you!

Extension Actions