Angular 1.5 - Ui-router, Resolve Object Returning Undefined Values

I am unable to get resolved data (via resolve object) from ui router pre-loaded into a component controller. the properties are showing up in the component's this object, but all p

Solution 1:

As long as you are not using the 1.0.0 (currently beta) version of the ui-router there is no way to directly use the components. For the beta version, please see this discussion: https://github.com/angular-ui/ui-router/issues/2627. There is also a tutorial on how to use routing to components with resolves: https://ui-router.github.io/tutorial/ng1/hellogalaxy

What you are doing here is creating a state named loans with an implicit controller and scope which will have the resolved data assigned. In the template you then instantiate your component without passing any of the attributes required.

So if you want to use your component with the 0.2.x ui-router, you need to add some dummy controller which gets the resolved properties injected and then pass the values of the dummy controller into the component via the template like

<w-loanssettings="settings".../>

Depending on how new your version of the ui-router is (0.3.x?), you can probably use the newly introduced $resolve property to avoid creating a dummy controller like this:

<w-loans settings="$resolve.settings" ...></w-loans>

Details here: https://github.com/angular-ui/ui-router/issues/2793#issuecomment-223764105

Solution 2:

I had a similar problem with Angular 1.6 and it looks like a different behavior of this version. My view is rendered after the promise is resolved, but the controller is called before, I think. It works for me using $onInit like the angular docs suggests:

.component('myComponent', {
  bindings: {value: '<'},
  controller: function() {
    this.$onInit = function() {
      // do somthing with this.value
    };
  }
})

https://github.com/angular/angular.js/issues/15545