Dependency injection into controller using $inject

Question

I am trying to inject a number of dependencies into a controller as part of a code refactoring process inline with John Papa's Style Guide. Right now, our controller looks like this:

.controller('alerting-settings.mainController', [
    '$scope',
    '$timeout',
    '$location',    
    '$document',
    '$window',

    function($scope,
             $timeout,
             $location,
             $document,
             $window) {

According to John Papa, it should be done more like this:

/* recommended */
angular
    .module('app')
    .controller('DashboardController', DashboardController);

DashboardController.$inject = ['$location', '$routeParams', 'common', 'dataservice'];

function DashboardController($location, $routeParams, common, dataservice) {
}

So what happens when I refactor? I end up with this:

angular.module('app.alerting-settings')

.controller('alerting-settings.mainController', alerting-settings.mainController);

    alerting-settings.mainController.$inject = [
    '$scope',
    '$timeout',
    '$location',    
    '$document',
    '$window'],

Problem is that I get console errors now:

What am I doing wrong?

I just did that but I still get "senses-lib.js:70 Uncaught Error: [$injector:nomod] Module 'app.alerting-settings' is not available!" — Marco V, Mar 29 '16 at 09:35

Rogerio Soares · Accepted Answer · 2016-03-29T09:34:40.550

3

You need to rename alerting-settings by alertingSettings everywhere.

You can use use "-" in file name but never in controller/service names because they are "functions" and in javascript you cant have a dash in function name

--> function alerting-settings() is not a valid function name.

edited Mar 29 '16 at 09:34

answered Mar 29 '16 at 09:25

Rogerio Soares

1,613
16
14

Dependency injection into controller using $inject

1 Answers1