Conditionally block routing

[spidergears]

I am trying to block routing in my application conditionally, as in code below. In all scenarios the code works fine except when the user opens a new tab and tries to access an inaccessible url, the digest cycle seems to go into a loop, since the state keeps switching between setupAccount and campaign.index, in case the user is trying to access /campigns url when he has not configured currency and timezone

$rootScope.$on('$stateChangeStart', function(event, toState, toParams, fromState, fromParams){
      // if currency or timezone is not set, move user to accountSetup page
      if ((!$rootScope.timezone || !$rootScope.currency_type) && toState.name != 'accountSetup'){
        event.preventDefault();
        $state.go('accountSetup'); //redirect to account setup page
      }
      else if(toState.name === 'rootpath'){ // captures the state for the first reload
          if(bPlan.campaign)
            $state.go('campaign.index');  // redirect to campaign path
          else
            $state.go('segment.index');  // redirect to segment path
      }
    })

[mikehuebner]

I'm having the same issue with this, I haven't figured out why this isn't working. $location.path() isn't doing the trick either. I'm tempted to use the native window with JS.

[michaelcox]

It's difficult to tell without seeing more of your app, but this may be related to #1699. It appears that event.preventDefault() will load the "otherwise" state prior to executing $state.go('accountSetup'). Depending on the logic you have in those states, you may be getting stuck in a loop? For example you may assume if they reached your "otherwise" route that they must have a timezone and currency_type configured.

[mikehuebner]

I was just reading some more on this, and I found out my $state.go won't work if its in the run. Is this true? I've just started getting into using $state instead of $location and it seems to of broke all my redirects, is this true?

[michaelcox]

That appears to be correct, yes. You'd have to move that logic to a state - possibly the "otherwise" state, which is the fall-through, rather than as part of your app startup cycle.

[mikehuebner]

Could I, in theory, move all my $state.go into a service, call the service in the run and just live happy? Or would that cause issues, or bad practice? I'm trying to figure out a good solution that doesn't involve heavy logic in the controller.

Sent from my iPhone

On Jan 29, 2015, at 2:23 PM, Michael Cox [email protected] wrote:

That appears to be correct, yes. You'd have to move that logic to a state - possibly the "otherwise" state, which is the fall-through, rather than as part of your app startup cycle.

—
Reply to this email directly or view it on GitHub.

[michaelcox]

You could put all that logic in a service and then call that service from the controller. That's a fairly typical pattern anyway. I'm guessing here, but I would suspect that you can't call it from run() regardless of whether you call it directly or from a service because the router hasn't been initialized at that point yet.

[mikehuebner]

Hmmm. Fair enough, I think this answers my question and I'll give it a shot. As for @spidergears I'm not sure if this helps..

[mikehuebner]

DOUBLE EDIT:
Alright came across an issue where I'm trying to log out, heres the code if this helps. It is located in the body controller.

$rootScope.$on(const.auth.logoutSuccess, function (e) {
            if ($state.current.name !== 'login') {
                console.log("We get here, the login doesn't match");
                e.preventDefault();
                $timeout(function () {
                    $state.go('login');
                });
            }
        });

EDIT:
Jk again, I wrapped it in a $timeout and it fixed it.

Jk, having this issue. It still isn't redirecting. Here is the only login I have in the service.

this.auth = function () {
            console.log("yo!")
            if ($rootScope.globals != undefined && AuthService.isAuthenticated()) {
                console.log("testing");
                if ($rootScope.globals.level & const.level.INVENTORY_RW) {
                    console.log("in the first level"); // I get here
                    $state.go("foo.inventory");
                } else
                    $state.go("foo.about");
            } else {
                console.log("testing");
                $state.go("login");
            }

            if ($state.current.name !== 'login' && !$rootScope.globals.guid) {
                // $timeout(function () {
                $state.go('login');
                // });
            } else if ($state.current.name == 'login' && $rootScope.globals.guid) {
                // $timeout(function () {
                $state.go('foo');
                // });
            }
        };

And I just call it in the controller like route.auth() and it works! I get all the logs! But it doesn't redirect.

[spidergears]

@mikehuebner @michaelcox I went through a few more issue and looks like its something how angular has been implemented. What seemed to do the trick for me was using native window.location for accountSetup redirect. The other two redirects for campaign.index and segment.index still work good with $state.go() .
#898 and #1158 offer some help in the context.

i am still looking into it as why the other two redirects work but not this. Only thing different is that the other two redirects are only called on user login and no time later.

[michaelcox]

@mikehuebner - I think you've probably gone past the scope of an issue against this project. I'm not sure what's up, but you're probably better off either asking on StackOverflow or trimming your project down to a simple Plunker if you think there's an actual bug with UI-Router.

[eddiemonge]

https://gist.github.com/eddiemonge/f6a58169c2846731a1eb