$state resolve gives me blank page in browser

ionic-v1
1

I am using this code:

           .state('app.dashboard', {
             url: "/dashboard",
             views: {
               'menuContent': {
                 templateUrl: "templates/dashboard.html",
                 controller: "DashCntrl",
                 resolve: {
                   authorize: ['authorization',
                     function(LoginService) {
                       return LoginService.checkLogin();
                     }
                   ]
                 }
               }
             }
           })

Whenever I remove the resolve part, it does load the views. However, when I deploy the app to my phone or tablet, it is actually functioning.

What could be the issue? This is my LoginServe.checkLogin() function:

   factory.checkLogin = function(url) {
            url = typeof url !== 'undefined' ? url : "null";
            if (localStorage.o24_cid != "null") {
                    if (url != "null") {
                            $state.go(url);
                    }
                    return true;
            } else {
                    $state.go("app.login");
            }
    }

Thanks in advance!

2

Maybe you have to read the documentation about the “resolve” attribute.

This should be used to add preloaded data to a controller, not to handle redirections.
This check “auth”-check should be done in a controller.

An example:

  1. add a custom state attribute to the states, which needs authorization

    .state(‘app.dashboard’, {
    url: “/dashboard”,
    views: {
    ‘menuContent’: {
    templateUrl: “templates/dashboard.html”,
    controller: “DashCntrl”,
    auth: true
    }
    }
    })
    With the ui-router state events:
    https://github.com/angular-ui/ui-router/wiki#state-change-events

you can handle each state-change.
check if the “toState” has the attribute auth -> “toState.auth” -> if so navigate to another state

Greetz, bengtler.

3

Thanks for your reply! If I apply this, doesn’t it then navigate first to my dashboard, and then navigate to my login page afterwards? That’s what the checkLogin() does, it either returns true; or it navigates the user to the login page.

4

No, there is an ui-router event “$stateChangeStart” this is called before the transition is executed. :wink:

Yeah but you should not route in a state.resolve and the return true is useless if you already changed the state…

5

Hey,

I have implemented the $stateChangePart into my code, and it triggers which is nice. However, this scenario happens:

User opens app, default page is /dashboard
/dashboard is for authorized users only, so redirect to /login
However, before animating to the login view, you get to see the /dashboard view for a very short time, you also see the url go to /dashboard then change to /login quite fast.

Is there any way to have it just not go to /dashboard first, but just go to /login immediately?

Thanks

6

Where did you add the $stateChange code?

You have to add it in your Base controller or in the “.run()” part of your module.