CODEWITHSUNDEEP
angularjsangular-ui-router
Serhii Holinei
Serhii Holinei

Reputation: 5884

How to prevent nested resolvers in some child states with angular-ui-router?

Here is plnkr: http://plnkr.co/edit/wfIFA01kfG1zggsPo7Q9

I have one abstract parent state 'app' and two child states 'app.home' and 'app.signin'. Parent state has to resolve some asynchronous stuff.

app.core:

  $stateProvider
    .state('app', {
      url: '',
      abstract: true,

      // has to be resolved by any child state, except app.auth
      resolve: {
        Something: function($http) {
          // real delay
          return $http.get('http://httpbin.org/delay/5');
        }
      }
    });

app.home:

  $stateProvider
    .state('app.home', {
      url: '/home',
      views: {
        'main@' : {
          template: '<div>I am home page</div> <a ui-sref="app.signin">Sign in</a>'
        }
      }
    });

app.signin

  $stateProvider
    .state('app.signin', {
      url: '/',
      views: {
        'main@' : {
          template: '<div>I am signin page </div> <a ui-sref="app.home">Home page</a>'
        }
      }
    });

I want any child state require Something too, except app.signin. How can I do that?

Also worth to mention, I do not describe any resolvers at my child states. But they still wait till the parent is done, and I thought that (quote from ui-router doc):

The resolve keys MUST be injected into the child states if you want to wait for the promises to be resolved before instantiating the children.

And I dont know why child states still resolving parent`s dependency.

Upvotes: 1

Views: 407

Answers (1)

Norbor Illig
Norbor Illig

Reputation: 658

So the ideia is to create another abstract state from which app.signin will depend on. This plunker demonstrate that(fork from your plunker): http://plnkr.co/edit/kpfbylbBTVX8Erm5cgoF?p=preview

(function() {
  'use strict';
  angular
    .module('app.auth', [
      'app.core'
    ])
    .config(function ($stateProvider) {
      $stateProvider
      .state('app2', {
          url: '',
          abstract: true
        })
        .state('app2.signin', {
          url: '/',
          views: {
            'main@' : {
              template: '<div>I am signin page </div> <a ui-sref="app.home">Home page</a>'
            }
          }
        });
    });
})();

Upvotes: 0

Related Questions