Control resolve and controller via transition

[soundstep]

Hi,

First of all, I'm not sure I plainly understood the goal of the $transition. I still need to investigate more.

I tried to setup a different behavior between 2 states, depending of what is the "to" and what is the "from". Going from one state to another should resolve some data, the other way around should not.

Consider these 2 routes, a parent state and a child state, the child state is a modal window.

/page /page/modal

• They both have a resolve property that loads data.
• The modal window never resolve its data before the parent resolve its own.
• They have a different jem-view.

Here is what I tried to do:

• From /page to /page/modal:

Do everything as intended, display some html, resolve the data, instantiate the controllers.

• From /page/modal to /page:

The /page is already displayed as the /page/modal is a modal window. The route change should only change the url and make the /page/modal disappear. The /page state should not resolve the data, and should not re-instantiate the controller.

I manage not reloading the data with a transition that set a cached flag, but I didn't find a way to avoid to instantiate the controller.

$transition.cancel() was a close solution but I have other controllers that are watching the states to act accordingly, meaning the state needs to happen. Only not resolve the data and not re-create the controller.

Not sure how I could achieve that. Maybe something like:

$transition.continue({
    createController: false,
    resolveData: false
});

Here is how it looks like.

var cached = false;

$stateProvider

    .state('page', {
        route: '/page',
        views: {
            'main': {
                sticky: true,
                template: 'main.html',
                controller: 'MainController'
            }
        },
        resolve: {
            data: function() {
                if (cached) {
                    ... return cached data stored in a model
                }
                else {
                    ... return data from server and store it in a model
                }
            }
        }
    });

}])

$stateTransitionProvider

    .transition('page.modal', 'page', {
        before: function($transition) {
            cached = true;
        }
    });

}])

Any idea?

[jeme]

That is quite a few questions in one go, and good ones.

The goal of transition is to be able to alterate the behavior depending on "from" and "to", so you seem to understand the concept well enough. From here there is quite a few hooks to get a handle of... But the design has mostly been centered around canceling a state (which is not yet fully implemented as I am still not sure on the URL side of things)... Redirecting the state or altering the $to state...

The last thing only makes sense in a before scenario because views and resolves are applied just after that. So theoretically you should be able to do something in lines of: (Theoretically because this has not been tested)

$stateProvider

    .state('page', {
        route: '/page',
        views: { 'main': { sticky: true, template: 'main.html', controller: 'MainController' } },
        resolve: {
            data: function($cachingService) {
                $cachingService.clearCache();
                return $cachingService.getData();
            }
        }
    });

}])

$stateTransitionProvider
    .transition('page.modal', 'page', {
        before: function($transition, $to, $from) {
            $to.resolve.data =  function($cachingService) {
                return $cachingService.getData();
            }
        }
    });

}])

this should be ok since we copy the "toState" before initiating a transition, so the state as originally configured should be the same (assuming that the Angular extend functionality works as I expect)

I will try to see if I can add some tests to verify that scenario somehow... Unfortunately I am currently working on a release for a product at work, so the next month I will be pressed for time so it is very limited what time I have for this project.

But resolve needs an overall overhaul so also unchanging state resolves are cached, where again your able to change the behavior pr. resolve etc. I have slowly starting poking around in this area as part of the bug in resolve where I am creating a resolver service which should then also be usable in transitions to push values into it's cache.

If you have an thoughts in what sort of API would make sens to you as a consumer I would be happy to get those.

Not sure I got around all questions, which did I miss?

[soundstep]

Well thanks for your time anyway, that is very useful indeed.

I know docs are never finished, this would have its place in the transition parts, I didn't even realize that I was receiving the $to and $from in there.

Thanks!

[jeme]

They are actually mentioned here: https://github.com/dotJEM/angular-routing/wiki/Transition-provider

But that is a bit of an odd place maybe, not to mention that that page hardly contain enough information on what you can do with (or are meant to be able to do) with from and to (and in what stages, as between and after changes won't really have any effect).

There is allot of stuff that has not yet been ported to the API docs as I am still in a learning phase on NGDocs which more than anything angular lacks documentation. And so the API docs here suffer a bit from that. But I hope to add to it (when I know how) as people ask questions and somewhere along the way we would have a fitting level of documentation.