使用 ng-inspect chrome 扩展

ng-inspect 是一个轻量级 Chrome 扩展,用于调试 AngularJS 应用程序。

从元素面板中选择节点时,范围相关信息将显示在 ng-inspect 面板中。

https://i.stack.imgur.com/BQ1xj.jpg

暴露少量全局变量以快速访问 scope/isolateScope

$s      -- scope of the selected node
$is     -- isolateScope of the selected node
$el     -- jQuery element reference of the selected node (requiers jQuery)
$events -- events present on the selected node (requires jQuery)

https://i.stack.imgur.com/jn3Zo.jpg

提供对服务/工厂的轻松访问。

使用 $get() 按名称检索服务/工厂的实例。

https://i.stack.imgur.com/8sRj5.jpg

可以通过计算应用程序中的 no.of 范围,isolateScope,观察者和监听器来监视应用程序的性能。

使用 $count() 获取范围,isolateScope,观察者和监听器的计数。

https://i.stack.imgur.com/Du8Za.jpg

注意:此扩展仅在启用 debugInfo 时有效。

在这里下载 ng-inspect