Skip to content Skip to sidebar Skip to footer

Get Current Controller In Use In Angularjs

I want to log the usage of different features in our Angularjs application. Current feature in use is usually identified by the current route/url in browser but there are some feat

Solution 1:

I see several way to log infos from/of the controller.

1) using element.controller()

From the docs of element.controller():

controller(name) - retrieves the controller of the current element or its parent. By default retrieves controller associated with the ngController directive. If name is provided as camelCase directive name, then the controller for this directive will be retrieved (e.g. 'ngModel').

You can this function on very element to get its parent controller. Here is an snippet example using a directive:

var app = angular.module('app', [])
app.controller('MainController', function MainController() {});
app.controller('directiveCtrl', function directiveCtrl() {});

app.directive('controllerName', function($timeout) {
    return {
      restrict: 'A',
      template: '<div>My controller name is: {{cName}}</div>',
      controller: 'directiveCtrl',
      link: function($scope, elem, attrs) {
        var name;
        name = elem.controller().constructor.name;
        $scope.cName = name;
      }
    };
  });
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js">
</script>
<div ng-app="app">
  <div ng-controller="MainController">
    <div controller-name></div>
  </div>
  ***************************************************
  <div ng-controller="MainController">
    <div ng-controller="directiveCtrl">
      <div controller-name></div>
    </div>
  </div>
  <hr/>
</div>

2) using the console

You can access to every Angular object from your web console. For example, typing angular.element($0).scope() will get the current scope.

See this answer, which is very complete about the use of the console.

3) logging from the controller

You can add a console call in your controller at the beginning of the code, and log whatever you want. This way, you will know each time a controller is instanciated:

app.controller('MyCtrl', function($scope) {
    $scope.greetings = 'Hello world';
    console.log('MyCtrl instanciated!', $scope.greetings);
});

Solution 2:

Here is an interesting and funny way of logging instantiated controllers

angular.module('yourModule')
.decorator('$controller', ['$delegate', function controllerDecorator($delegate) {
    return function loggingController (expression, locals, later, ident) {

        // Do all your logging here
        if (typeof (expression) === 'function') {
            console.log('Controller:' + expression.name);

        } else if (locals.$$controller) {
            console.log('Controller: ' + locals.$$controller);

        } else if (expression instanceof Array) {
            console.log('Controller:' + expression[expression.length - 1].name);

        } else {
            console.log('Controller:' + expression);
        }

        // fire regular controller function
        return $delegate(expression, locals, later, ident);
    };
}]);

What you are doing here is pretty much extending angulars controller function so you get certain functionality on all controllers, not only yours


Solution 3:

Another way is injecting the $route service and calling:

$route.current.controller

Post a Comment for "Get Current Controller In Use In Angularjs"