Changing state before previous state's "resolve" finishes causes previous state to still load

[jullian-chavez]

So we have a state that needs to resolve some data prior to the controller being initiated. So, we put the specific API query into that state's "resolve" attribute. However, this API query may take several seconds to complete (unfortunately). As a result, if a user clicks a link to another state BEFORE the other state's resolve completes, the user is taken to that page, but then when the previous state's "resolve" promise resolves, the previous template and controller still load. I would think that if you change states, any unresolved state would be canceled out, unless i'm missing something.

$stateProvider
     .state('learn',{
            url: '/learn/:slug',
            views: {
                'template':{
                    templateUrl: '/templates/pages/learn/index.html',
                    controller: 'LearnController',
                    resolve: {
                        currentCard: function($stateParams, CardsResource){
                            return CardsResource.get({slug: $stateParams.slug}); //This can take several seconds
                        }
                    }
                }
            }
        });

If a user clicks a link to another state while this resolve function's "CardsResource" API call is still waiting for a response, the new state will load, and then the state pasted above will load it's template and controller, breaking the page. Again, I would think that if a user changes state, this state's resolves would be canceled.

[jullian-chavez]

Seems to already be acknowledged: #2126

[wesleycho]

Closing as a duplicate ticket