augury官网
augury安装
通过谷歌应用商店安装，在商店中搜索augury，点击install即可，参考augury官网
很多小伙伴因为种种原因无法登陆谷歌应用商店，可以参考以下地址下载和安装crx类型扩展工具（度娘总是会提供给你很多办法）
https://jingyan.baidu.com/article/e4511cf35c2df92b845eafb3.html
使用augury
使用augury可以查看angular应用的组件树，组件属性，DI关系，路由树以及每个NgModule包含的内容等等。
谷歌浏览器F12打开调试工具，点击augury，可以看到有Component Tree，Router Tree，NgModules
Component Tree
浏览器默认打开Component Tree，它展示了angular应用程序从根组件AppComponent开始的组件树，组件树展示了组件之间的层次关系。
选中某个组件，augury会在"Properties"选项卡中显示该组件的附加信息
- view source 点击可以跳转到组件对应的ts/js代码处
- Change Detection 组件检测策略
- instance Providers 只有在组件中注入服务时才会出现，在NgModule中注入不会出现
- state 组件的属性
- Dependencies 组件的依赖关系
你可以在state里面查看组件各属性的值是否正确，也可以通过augury修改属性值查看页面是否如你期望的那样，比如：在业务场景中有些页面需要根据某个属性值true false来判断是否显示时，通过state修改属性值即可看到效果，不需要去修改代码或对接后端等复杂操作，使用起来十分方便。
有时候在组件中我们会通过某个属性值的切换调用不同的方法，这种情况下无法在state中通过修改对应的属性值生效。
"Properties"选项卡旁边是"Injector Graph"，单击它将会显示组件和服务的层次关系。
Router Tree
路由结构十分清晰，懒加载的路由以(lazy)标识，加载后才能查看
NgModules
展示了你应用中每个模块的导入，导出，声明以及DI等等
总结
通过augury的特性可以帮助我们更方便的查看angular应用的结构，调试angular代码，更多详细内容请参考augury官网
