使用ng-inspector调试Angular页面_ng-inspect helps in debugging angular applications

【摘要】

AngularJS是我们部门Web项目最核心最常用的前端开发框架，ng-inspector是一个Chrome扩展插件，可以实时显示scope变量，有效提高调试效率。

【正文】

安装

在Chrome应用商店中搜索ng-inspector后点击安装（需自配梯子），安装完成后会在Chrome工具栏显示相应图标

使用

在使用了AngularJS的页面，点击工具栏ng-inspector图标即可。页面右侧面板会展示scope下的所有变量，如下图，在控制器ctrl中定义了一个变量$scope.name，并把它绑定到input标签上，右侧面板把该变量值显示了出来。