23tux
23tux

Reputation: 14736

ui-router: Parent's resolve not called when state changes

in ui-router, when a state changes it should call all its parent resolves. This works the first time a state changes. But for the second time, the resolves of the parent aren't called (maybe because they already resolved before).

This is the state configuration

var app = angular.module('plunker', ['ui.router']);

app.config(function($stateProvider) {
  $stateProvider
  .state('root', {
    abstract: true,
    resolve: {
      preloadData: function() {
        console.log("preloadData");
        return true;
      }
    }
  })
  .state('root.home', {
    resolve: {
      test: function() {
        console.log('Home')
        return true;
      }
    }
  })
  .state('root.login', {
    resolve: {
      test: function() {
        console.log('Login')
        return true;
      }
    }
  });
});

And here is the plnkr http://plnkr.co/edit/rMVbxErZyStt97JifJlj. Open the dev console and click on the buttons. You see that preloadData is only called the first time a state changes. For future state changes it is not called.

Is this behaviour intended / normal? Is there a way to force a call to the parent's resolves on every state change?

Upvotes: 2

Views: 846

Answers (1)

New Dev
New Dev

Reputation: 49590

The "resolves" of a particular state run when you go to that state (or one of its descendants) from a "outsider" state - i.e. a state outside of the hierarchy tree of the state in question. Then, navigation between its descendants and itself does not re-run the "resolves" and the controllers.

In other words, given the following example of state hierarchy:

     A     B
    /     /
   AA    C
        / \
       C1 C2

Then, switching from A to B would run B's controller and "resolves", because A is outside the B tree. Switching then to C (or C1 or C2), and then back to B, would not re-run B's resolves.

If you then switch back to A (or AA), then A would resolves would run.

Upvotes: 5

Related Questions