Angular Get Controller from Element

Question

Is there a way to find the controller for an element through Chrome's console? I can get a reference to the component by selecting the element in the Elements Panel and using

var c = angular.element($0);

c has a controller property (looks like a constructor), but I'm not sure what to do with this. Is there any way to find the controller's name from here?

Answer 1

If you do angular.element($0).scope() or just $scope(if you installed Batarang Chrome extension), you should be able to get access to selected element's scope's functions and properties. This should also include any functions/attributes that a controller has exposed on the scope.

There is no way to get the controller's name, though.

Answer 2

Assuming you're not using anonymous functions for a controller you can use something like this:

angular.element(element).controller().constructor.name

codepen - http://codepen.io/jusopi/pen/jWYWzv?editors=101

At least as of Angular 1.2.27, per their documentation you can do this. Look under the JQLite Extras Method section - https://docs.angularjs.org/api/ng/function/angular.element