4

For some reason, my resolvedData is not seeing by controllers when using multiple named views (angular-ui ui-router). Has anyone faced this issue?

$stateProvider
    .state('page',{
           abstract: true,
           templateUrl: ...,
           controller: abstractController
    })
    .state('page.index',
           url: '/page',
           resolve : {
               resolvedData: function(CONSTANTS){ return CONSTANTS.data;}
           },
           views: {
               home: {templateUrl: ..., 
                      controller: function(resolvedData){
                        ....
                      }
               },
               list: {templateUrl: ..., 
                      controller: function(resolvedData){
                        ....
                      }
               },
               edit: {templateUrl: ..., 
                      controller: function(resolvedData){
                        ....
                      }
               }
           }
     )

The error it gives me is: Error: [$injector:unpr] Unknown provider: resolvedDataProvider <- resolvedData. It is somehow interesting because it happens only in one of the views but not in the others.

Improve this question

1 Answer 1

Reset to default
3

I created small working example, showing that your stuff should work

This would be the CONSTANTS:

.factory('CONSTANTS', function() {
    return { data: { name :  "some name", number : "some number"} };
})

And the same (just explicitly annotated DI) state def:

  // States
  $stateProvider
    .state('page', {
      abstract: true,
      template: '<div>' 
       + '<div ui-view="home"></div>' 
       + '<div ui-view="list"></div></div>',
      controller: 'abstractController'
    })
    .state('page.index', {
      url: '/page',
      resolve: {
        resolvedData: ['CONSTANTS',
          function(CONSTANTS) {
            return CONSTANTS.data;
          }
        ]
      },
      views: {
        home: {
          templateUrl: 'tpl.html',
          controller: ['resolvedData','$scope',
            function(resolvedData, $scope) {
              console.log(resolvedData);
              $scope.resolvedData = resolvedData;
            }
          ],
        },
        list: {
          template: '<div>list view</div>'
        }
      }
    })

So, the draft of the resolve used above is working. It is the right way...The resolve function is provided with some service ... and returns its property data.

Check that all here

Improve this answer
Sign up to request clarification or add additional context in comments.

5 Comments

Ok... so it has to be then some duplication or missed type thing. Im leaving this open until I solve it. Thanks for the plnkr. Its enough to know that it should be working :)
Great to see that... yes, I would expect some typo... Good luck with UI-Router anyhow
Just for the readers, I ended up writing the resolve in the abstract state, defining a controller and filling the $scope with the data I need. Children state can see this information properly. Really similar to what it is defined in Nested States and Nested Views (github.com/angular-ui/ui-router/wiki/…). plnkr.co/edit/gmtcE2?p=preview
@Pureferret The example written by Radim Köhler demostrates that it should be working. I guess that I had some typo. Do you still need help with it? Did you experience the same issue?
@kitimenpolku I was trying to adapt it to something slightly different. I've got mine working though. Thanks for asking.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.