Global variable between run and controller angularjs

Question

i have a script angularjs with this code :

var myApp = angular.module('App_example', ['duScroll'])
.run(function($rootScope, $location, $window) {

    var url = $window.location.href;
    if( url.indexOf("section1") != -1 ) {
        $rootScope.edition = "section1";
    } else {
        if(url.indexOf("section2") != -1) {
            $rootScope.edition = "section2";
        } else if(url.indexOf("section3") != -1) {
            $rootScope.edition = "section3";
        } else {
            $rootScope.edition = "section4";
        }
     }
     if(!history || !history.replaceState) {
         return;
     }
     $rootScope.$on('duScrollspy:becameActive', function($event, $element){
         //Automaticly update location
         var hash = $element.prop('hash');
         if (hash) {
             history.replaceState(null, null, hash+'_'+$rootScope.edition);
         }
     });
});

and this controller :

myApp.controller('ImageController', ['$scope', '$window', '$location', '$document', '$rootScope', function($scope,$window,$location,$document,$state,$rootScope) {

     var url = $window.location.href;
     if( url.indexOf("section1") == -1 ) {
        $rootScope.edition = "section1";
     } else {
        if(url.indexOf("section2") != -1) {
            $rootScope.edition = "section2";
        } else if(url.indexOf("section3") != -1) {
            $rootScope.edition = "section3";
        } else {
            $rootScope.edition = "section4";
        }
     }
});

But I have this flollowing error and I don't know why. How can I pass global variable between the run and the controller. It's for manipulate the url without reloading.

TypeError: Cannot set property 'edition' of undefined

Thanks.

You missed $state dependency in dependencies definition, so $rootScope is assigned to parameter $state. — Przemysław Piechota. kibao
– Przemysław Piechota. kibao, Commented Jun 5, 2015 at 15:18

Rodrigo Brancher · Accepted Answer · 2015-06-05 15:26:50Z

2

The string elements into the Array must match the dependencies injected (as arguments) on the function itself:

myApp.controller('ImageController', 
['$scope', '$window', '$location', '$document', '$state', '$rootScope', 
function ($scope, $window, $location, $document, $state, $rootScope) { 
    ... 
}]);

And that is because you are using “annotated dependency injection”, i.e., you are explicitly naming the dependencies with strings before injecting them into the controller. That's a best practice to avoid problems with minification, as explained here: angular docs

That said, you could also fix the issue by passing the function directly, without annotating the dependencies, like this:

myApp.controller('ImageController', 
function ($scope, $window, $location, $document, $state, $rootScope) { 
    ... 
});

answered Jun 5, 2015 at 15:26

Rodrigo Brancher

1406 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Oleksandr T. · Accepted Answer · 2015-06-05 15:40:20Z

0

Add all dependencies to function in correct order, because you missed some (like $state)

myApp.controller('ImageController', 
   ['$rootScope', '$scope', '$window', '$location', '$document', '$state',  
   function ($rootScope, $scope, $window, $location, $document, $state) {
      // code 
   });

edited Jun 5, 2015 at 15:40

answered Jun 5, 2015 at 15:13

Oleksandr T.

77.6k17 gold badges177 silver badges145 bronze badges

Comments

Blue · Accepted Answer · 2015-06-05 15:18:56Z

0

The issue is this line. Your array mentions 5 parameters, but your function takes 6. You forgot to add $state to the array. As your code sits now, it will assign $rootScope to the $state object, and $rootScope will be undefined.

myApp.controller('ImageController', ['$scope', '$window', '$location', '$document', '$rootScope', function($scope,$window,$location,$document,$state,$rootScope) {

Simply add $state into the array, and your code should work as intended.

myApp.controller('ImageController', ['$scope', '$window', '$location', '$document', '$state', '$rootScope', function($scope,$window,$location,$document,$state,$rootScope) {

answered Jun 5, 2015 at 15:18

Blue

23k7 gold badges69 silver badges102 bronze badges

1 Comment

Martel Benjamin Over a year ago

Thanks but you're three to answer me the same thing :/ I will choose the first who respond sorry but thanks again for anwsering me so fast ^^

Collectives™ on Stack Overflow

Global variable between run and controller angularjs

3 Answers 3

Comments

Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related