Chrome Devetools Elements sidebar to displays Angular Component (pre-Ivy and Ivy) and AngularJS Scope for selected element i.e. $0
How it works
The extension evaluates the following expression in the context of the page and displays the results in 'ngprobe' sidebar pane:
If Angular (Ivy) is detecetd:
```
ng.getOwningComponent($0)
where:
$0 is the element selected in Elements tab.
```
If Angular (pre Ivy) is detecetd:
---
ng.probe($0).componentInstance
where:
$0 is the element selected in Elements tab.
---
If AngularJS is detected:
---
angular.element($0).scope()
where:
$0 is the element selected in Elements tab.
---
Also shows parent components or scopes as an array.
The values of component properties can be edited in the ngprobe sidebar pane.
Latest reviews
- (2019-07-11) Dennis Liu: Thank you for providing such an amazing AngularJS debugging plugin in 2019. I had tried Angular JS Batarang and ng-inspector; all of them failed to work with Chrome 74.0.3729.169 (Official Build) (64-bit) with AngularJS 1.7.7.