Using $scope in ui-router resolve

Question

I am using ui-router resolve in order to get some data from a service.

The thing is that I need to get a value from the parent $scope in order to call the service as shown bellow.

resolve: {
              contactService: 'contactService',
              contacts: function ($scope, contactService) {
                  return contactService.getContacts($scope.parentCtrl.parentObjectId);
              }
          }

I keep getting Error: [$rootScope:infdig] 10 $digest() iterations reached. Aborting!

Also tried a few desperate attempts such as adding scope to the resolve object as shown bellow with not success.

scope: $scope

Any ideas?

Answer 1

That's impossible, scope hasn't been initialized at that point so you can't use it in the resolve object. You can access the scope in the controller after it's been initialized. The whole point of resolve is that it runs before controller initialization so that you can inject and directly access the resolved items in your scope.

If you need to pass a variable to the next state you can do that by using the $stateParams object which is available for use in resolve. You can add data to it when changing states, eg:

In your template, if you have a objectId in your scope:

<a ui-sref="statename({'id': objectId})">Change states</a>

Or in your controller:

$scope.go('statename', {'id': $scope.objectId});

You can then retrieve that in your resolve by using the $stateParams:

resolve: {
    contactService: 'contactService',
    contacts: function ($stateParams, contactService) {
        return contactService.getContacts($stateParams.id);
    }
}