Take the 2-minute tour ×
Stack Overflow is a question and answer site for professional and enthusiast programmers. It's 100% free, no registration required.

I'm attempting to handle http errors within AngularJS (using ui-router), but am losing the context of my run function in the following code.

bugtracker.run(['$rootScope', '$state', function($rootScope, $state) {
    //at this point $state and $rootScope are defined
    $rootScope.$on('$stateChangeError', function(event, toState, toParams, fromState, fromParams, error) {
        //at this point $state and $rootScope are undefined
    });
}]);

The code that causes $stateChangeError to trigger is as follows.

//main.js
bugtracker.config(['$stateProvider', '$httpProvider', '$compileProvider', function($stateProvider, $httpProvider, $compileProvider) {
    //...
    $stateProvider.state('projects.show', {
        url: '/{projectId:[0-9]{1,8}}',
        templateUrl: '/assets/projects/show.html',
        controller: 'ProjectShowCtrl',
        resolve: bugtracker.controller('ProjectShowCtrl').resolve
    });
    //...
}]);

//ProjectShowCtrl.js
projectShowCtrl.resolve = {
    project: function(Project, $q, $stateParams, $state) {
        var deferred = $q.defer();
        Project.findById($stateParams.projectId, function(successData) {
            deferred.resolve(successData); 
        }, function(errorData) {
            deferred.reject(errorData); // you could optionally pass error data here
        });
        return deferred.promise;
    },
    delay: function($q, $timeout) {
        var delay = $q.defer();
        $timeout(delay.resolve, 1000);
        return delay.promise;
    }
};

I would like $state to be defined within the anonymous function called by the $on function so that I could redirect the user to a 401, 403, etc. page, but I'm unsure why it is not. In other examples I have seen (https://github.com/angular-ui/ui-router/issues/898) it is implied that $state is defined within the context of the anonymous function.

If anyone could explain why $state is not defined or what I can change to make it defined I would greatly appreciate it!

share|improve this question
3  
There's no way these would be undefined, unless they were already undefined in the run block. However I've seen cases where the debugging tool thinks some variables are undefined when they actually aren't. That happened to me in FireBug with an old FF version. –  plalx May 11 at 1:00
    
Regardless of angular, what you are claiming violates the javascript language. –  Fresheyeball May 11 at 1:01
    
I completely agree, however, I've been debugging this for the past few hours and I can say with complete certainty that they are undefined. As a side note, this within the anonymous function is window. This may be normal; however, I would have expected it to be $rootScope. –  Scott Mielcarski May 11 at 1:06
    
@plalx Submit your comment as an answer and I'll mark it as correct! It must've been a bug within the Chrome debug tools because I tried writing what I wanted ($state.transitionTo('error.401')) and it worked! I can't believe it, thank you! –  Scott Mielcarski May 11 at 1:08
    
@ScottMielcarski Great, I'm glad that was it and $rootScope would have been this only if the library was designed that way. –  plalx May 11 at 1:25
add comment

1 Answer

up vote 3 down vote accepted

There's no way these would be undefined, unless they were already undefined in the run block. However I've seen cases where the debugging tool thinks some variables are undefined when they actually aren't. That happened to me in FireBug with an old FF version.

share|improve this answer
add comment

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.