CODEWITHSUNDEEP
angularjsangular-ui-router
JKX
JKX

Reputation: 187

Angular ui-router issue with state.go()

I have checks to see weather a user has access to pages which is executed inside $stateChangeStart

Here it is

$rootScope.$on('$stateChangeStart', function (event, toState) {
        if ($rootScope.accessRights.length > 0) {
            if (toState.data.accessControlled == true) {

                var userHasAccess = false;
                for (var i = 0; i < $rootScope.accessControlledPages.length; i++) {
                    if (toState.name == $rootScope.accessControlledPages[i].page) {
                        userHasAccess = true;
                        break;
                    }
                }
                //If user has access do nada, else redirect them to 404 page or page to TBD
                if (!userHasAccess) {
                    event.preventDefault();
                    $state.go('Errors');
                }   
            }
        }
        else
        {
            processPageAccess();
            $state.go(toState.name);
        }

    });

The problem I have is that $state.go('Errors');

Does nothing, I just stay on the page that I was on when I attempted to navigate to the access controlled page. Is there something I'm not doing

Upvotes: 0

Views: 414

Answers (3)

JKX
JKX

Reputation: 187

Idiot mistake, wasn't injecting $state to the controller. Recently moved to ui-router from regular angular routing and hadn't updated all the controllers

Upvotes: 0

Alexander Strochkov
Alexander Strochkov

Reputation: 417

As i know you need something like this to avoid state changes loops:

$rootScope.$on('$stateChangeStart',function (event, toState, toParams, fromState, fromParams) {
event.preventDefault();
// If authorized, use call state.go without triggering the event.
// Then trigger $stateChangeSuccess manually to resume the rest of the process
// Note: This is a pseudo-hacky fix which should be fixed in future ui-router versions
if (!$rootScope.$broadcast('$stateChangeStart', toState, toParams, fromState, fromParams).defaultPrevented) {
    $rootScope.$broadcast('$stateChangePermissionAccepted', toState, toParams);

    $state.go(toState.name, toParams, {notify: false}).then(function() {
        $rootScope.$broadcast('$stateChangeSuccess', toState, toParams, fromState, fromParams);
   });
}
})

As example you can see here

Upvotes: 2

Mohan Singh
Mohan Singh

Reputation: 883

if (!userHasAccess) {
   $state.go('Errors');
}

Simply remove event.preventDefault();

event.preventDefault(); is used to cancel the state transition.

Upvotes: 0

Related Questions