Shamoon
Shamoon

Reputation: 43491

ui-router resolving before a controller not working properly

My state definition looks like:

.state('repository', {
  url: '/repository/:host/:owner/:repository',
  views: {
    appView: {
      templateUrl: '/templates/app/repository.html'
    },
    'repositoryView@repository': {
      templateUrl: '/templates/app/_repositoryAnalytics.html'
    }
  },
  resolve: {
    resolvedRepository: [
      '$stateParams', 'RepositoryService', function($stateParams, RepositoryService) {
        console.log(RepositoryService.find($stateParams.host, $stateParams.owner, $stateParams.repository));
        return 1;
      }
    ]
  },
  controller: 'AnalyticsController'
});

However, it hands and never gets to the AnalyticsController. If I remove the resolve, then it works just fine (except, of course, I don't have the resolved value).

I did return 1 for now just to see if it would return something without worrying about promises. I did the console.log to see if it hit, and it does not.

Upvotes: 1

Views: 191

Answers (2)

Radim Köhler
Radim Köhler

Reputation: 123861

I created update of the prvious plunker here. All is working if all the parts are as well. Your resolve code is ok (it could really return just a value). The only thing different is:

The controller belongs to the view === { views : { viewName : { template, controller}}}

Controller should not (cannot) be defined at the state level. It simply is there to do the MVC stuff...

$stateProvider.state('repository', {
  url: '/:host/:owner/:repository',
  views: {
    appView: {
      template: '<div><h1>Repository</h1><div ui-view="repositoryView" ></div>',
      controller: 'AnalyticsController', // here is new position
    }
  },
  // removed from here
  // controller: 'AnalyticsController',
  resolve: { 
    resolvedRepository: [
      '$stateParams', 'RepositoryService', function($stateParams, RepositoryService) {
        console.log(RepositoryService.find($stateParams.host, $stateParams.owner, $stateParams.repository));
        return 1;
      }
    ]
  },

Check it in action here

Upvotes: 1

iH8
iH8

Reputation: 28638

If you want to return a value for testing purposes, you need to do it in an object, see the first example here: https://github.com/angular-ui/ui-router/wiki#resolve

resolve: {
    resolvedRepository: [
        '$stateParams',
        'RepositoryService',
        function($stateParams, RepositoryService) {
            return {'value': 1};
        }
    ]
}

If that won't work, try leaving out your RepositoryService to check if that's the problem:

resolve: {
    resolvedRepository: [
        '$stateParams',
        function($stateParams) {
            return {'value': 1};
        }
    ]
}

Upvotes: 1

Related Questions