Sam Sam - 1 month ago 32
AngularJS Question

Angular ui-router $state.go is not redirecting inside resolve

In my angularjs app, I am checking if user lands on landing page and is already authenticated, then redirect him to home page.

.state('landingpage', {
abstract: "true",
url: "/landingpage",
templateUrl: "app/landingpage/landingpage.html",
resolve: {
AutoLoginCheck: ['$state', '$window', function ($state, $window) {

if($window.localStorage.access_token != null)
{
if($window.sessionStorage.access_token == null) {
$window.sessionStorage.access_token = $window.localStorage.access_token;
}
UserInfoService.SetUserAuthenticated(true);

// it is not redirecting
return $state.go('app.home');

}
}]
}
})


The problem is that though all the resolve code is successfully run, user is not getting redirected to app.home. Can someone tell why this happens?

Note: The state 'app' also has a resolve in which it fetches the data to be displayed in 'app.home' state.

Answer

There can be two solutions to your problem

  • Firstly you can emit an event and the listener will handle your state transition. You can implement the listener in anywhere in a parent controller

  • Secondly you can implement the $stateChangeStart hook and check your redirection condition there

    $rootScope.$on('$stateChangeStart', function (event, toState) {      
         if (toState.name === 'landingpage') {              
           if (!isAuthenticated()) { // Check if user allowed to transition                  
                event.preventDefault();   // Prevent migration to default state                  
                $state.go('home.dashboard');           
            }
          }
    });