运行和控制器angularjs之间的全局变量

时间:2022-01-29 19:35:11

i have a script angularjs with this code :

我有一个脚本angularjs与此代码:

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.

但是我犯了一个很明显的错误,我不知道为什么。如何在运行和控制器之间传递全局变量。它用于在不重载的情况下操作url。

TypeError: Cannot set property 'edition' of undefined

TypeError:不能设置未定义的属性'edition'

Thanks.

谢谢。

3 个解决方案

#1


0  

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

将所有依赖项按正确顺序添加到函数中,因为您漏掉了一些(如$state)

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

#2


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) { 
    ... 
});

#3


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.

问题是这条线。你的数组包含5个参数,但是你的函数包含6个参数。您忘记向数组添加$state了。由于您的代码现在的位置,它将为$state对象分配$rootScope,并且$rootScope将是未定义的。

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.

只需在数组中添加$state,您的代码就可以正常工作了。

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

#1


0  

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

将所有依赖项按正确顺序添加到函数中,因为您漏掉了一些(如$state)

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

#2


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) { 
    ... 
});

#3


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.

问题是这条线。你的数组包含5个参数,但是你的函数包含6个参数。您忘记向数组添加$state了。由于您的代码现在的位置,它将为$state对象分配$rootScope,并且$rootScope将是未定义的。

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.

只需在数组中添加$state,您的代码就可以正常工作了。

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