Passing result of resolve into controller with UI-

Question

I'm trying to learn how to use resolves with UI-Router, and I think there's a piece of information I'm missing, because I can't figure out how to make them work.

I have a state set like this:

app.config(['$stateProvider', function($stateProvider) {
    $stateProvider
        .state('testState', {
            url: '/testRoute',
            controller: 'TestContoller',
            views: {
                "body": { 
                    templateUrl: "testHtml.html" 
                }
             },
            resolve: {
                test:  function(){
                    return {value: "test"};
                 }
            }
        })      
}]);

And then I have a controller:

app.controller("TestController", ["$scope", "test", function($scope, test) {
    console.log(test);
}]);

then I have a testHtml.html partial file that doesn't have anything in at the moment:

<div ng-controller="TestController">
Test content
</div>

And that gets loaded into the ui-view in index.html:

<div ui-view="body" autoscroll></div>

I've been fiddling around with this for an hour or so now and googling around and I can't quite figure out what I should be doing to get the resolve to do something and pass the result into the controller.

Answer 1

When you mention views properties on state level options, it ignores templateUrl & controller on that state. It only take controller & template/templateUrl from one of view.

Code

views: {
   "body": { 
      templateUrl: "testHtml.html",
      controller: 'TestContoller' //moved it to named-view level
   }
},