Angular UI router does not allow input parameters

Question

So, consider the following snippet from my angularUI routing setup. I am viewing the route / category / management / 4 / details (for example). I expect the “category” to be resolved before the corresponding controller is loaded, and indeed, to the extent that I can put a breakpoint inside the permission function, which returns the category from the category service and sees that the category has been returned. Now, putting another breakpoint inside the controller itself, I see that the "category" is always undefined. It is not entered by the user interface router.

Can anyone see the problem? It may be somewhere else than in the code I provided, but since I have no errors when running the code, it is impossible to determine where the source of the problem may be. Typical failures of silence!

.state('category.manage', { url: '/manage', templateUrl: '/main/category/tree', controller: 'CategoryCtrl' }) .state('category.manage.view', { abstract: true, url: '/{categoryId:[0-9]*}', resolve: { category: ['CategoryService', '$stateParams', function (CategoryService, $stateParams) { return CategoryService.getCategory($stateParams.categoryId).then(returnData); //this line runs before the controller is instantiated }] }, views: { 'category-content': { templateUrl: '/main/category/ribbon', controller: ['$scope', 'category', function ($scope, category) { $scope.category = category; //category is always undefined, ie, UI router is not injecting it }] } }, }) .state('category.manage.view.details', { url: '/details', data: { mode: 'view' }, templateUrl: '/main/category/details', controller: 'CategoryDetailsCtrl as details' }) 

Answer 1

The concept is working. I created a working plunker here . Changes here

instead of this

 resolve: { category: ['CategoryService', '$stateParams', function (CategoryService, $stateParams) { //this line runs before the controller is instantiated return CategoryService.getCategory($stateParams.categoryId).then(returnData); }] }, 

I just returned the result of getCategory ...

 resolve: { category: ['CategoryService', '$stateParams', function (CategoryService, $stateParams) { return CategoryService.getCategory($stateParams.categoryId); // not then }] }, 

with naive implementation of the service:

 .factory('CategoryService', function() {return { getCategory : function(id){ return { category : 'SuperClass', categoryId: id }; } }}); 

even if it is a promise ... The solution will wait until it is processed ...

 .factory('CategoryService', function($timeout) {return { getCategory : function(id){ return $timeout(function() { return { category : 'SuperClass', categoryId: id }; }, 500); } }});