Allow multiple objects in uriljs ui-router state?

Question

Here is my code:

.state("dashboard.userRoles", { url: "/user/:id/roles", controller: "userRolesController as vm", templateUrl: "app/auth/users/user-roles.html", resolve: { user: function (userResource, $stateParams) { return userResource.get({ id: $stateParams.id }).then(function (res) { return res.data; }); }, roles: function($http, $stateParams) { var url = appSettings.authApiBaseUrl + "api/accounts/users/" + $stateParams.id + "/roles"; return $http.get(url).then(function(res) { return res.data; }); }, loadMyFiles: function($ocLazyLoad) { return $ocLazyLoad.load({ name: "app", files: [ "app/auth/users/userRolesController.js" ] }); } } }) 

If I go to dashboard.userRole and look in fiddler, I see a request for a user resource, but not for the role. If I comment on the user: section, I see a request for roles in the violin. Why can't I solve both issues? Should I just send the identifier to the controller and is that all there?

I tried to avoid collecting data in the controller, as it should just be stitching between the view model file and ui. Maybe it doesn't matter? Thanks in advance.

---

Edit 1: Okay, I can change the code to this and see both requests shown in the script, and both of them return correctly formatted json data:

 .state("dashboard.userRoles", { url: "/user/:id/roles", controller: "userRolesController as vm", templateUrl: "app/auth/users/user-roles.html", resolve: { user: function (userResource, $stateParams) { return userResource.get({ id: $stateParams.id }).$promise; }, roles: function($http, $stateParams) { var url = appSettings.authApiBaseUrl + "api/accounts/users/" + $stateParams.id + "/roles"; return $http.get(url).then(function(res) { return res.data; }).$promise; }, loadMyFiles: function($ocLazyLoad) { return $ocLazyLoad.load({ name: "app", files: [ "app/auth/users/userRolesController.js" ] }); } } }) 

However, the roles entered into the controller are always "undefined". The user is filled in correctly. And the answer from the violinist shows the roles that are being returned, so I'm not sure why they are undefined. Here is the controller code.

 "use strict"; angular .module("app") .controller("userRolesController", [ "user", "roles", function (user, roles) { console.log("app.userRolesController.function()"); var vm = this; vm.user = user; vm.roles = roles; } ]); 

Answer 1

This angular -ui-router question / question was helpful. Anyway, it works!

 .state("dashboard.userRoles", { url: "/user/:id/roles", controller: "userRolesController as vm", templateUrl: "app/auth/users/user-roles.html", resolve: { user: function (userResource, $stateParams) { return userResource.get({ id: $stateParams.id }); }, roles: function($http, $stateParams) { var url = appSettings.authApiBaseUrl + "api/accounts/users/" + $stateParams.id + "/roles"; return $http.get(url); }, loadMyFiles: function($ocLazyLoad) { return $ocLazyLoad.load({ name: "app", files: [ "app/auth/users/userRolesController.js" ] }); } } }) 

And here is the controller. Important role data is important!

 angular .module("app") .controller("userRolesController", [ "user", "roles", function (user, roles) { var vm = this; vm.user = user; vm.roles = roles.data; } ]); 

Answer 2

Set a breakpoint (or clock) in the Chrome browser (in your angular controller). And check out $state . I found my answer:

  $state.$current.locals.globals.employeeslist 

Answer 3

This is pretty weird. Perhaps you could try:

 .state("dashboard.userRoles", { url: "/user/:id/roles", controller: "userRolesController as vm", templateUrl: "app/auth/users/user-roles.html", resolve: { // put both in one object data: function (userResource, $stateParams, $http) { var url = appSettings.authApiBaseUrl + "api/accounts/users/" + $stateParams.id + "/roles"; return { user: userResource.get({ id: $stateParams.id }).then(function (res) { return res.data; }); roles: $http.get(url).then(function(res) { return res.data; }); } }, loadMyFiles: function($ocLazyLoad) { return $ocLazyLoad.load({ name: "app", files: [ "app/auth/users/userRolesController.js" ] }); } } }) 

Update:

The solution above does not fix the problem. The OP resolved its problem (see comments below).