1

Basically, how to access an unnamed state's controller in html? I'm generating states with a loop, including unnamed controllers in my SPA. Although the routes are working fine, the homepage ng-includes each of the states but obviously doesn't load each state controller on the /home route.

Here's an example of what I want, which works fine when I navigate to /about and {{thisData}} = 'about Data' as expected but I want that $scope also on the /home route that has ng-include.

<div ng-include="'views/about.html'" ng-controller="the about state's controller"></div>

In my app.js..

var routes, setRoutes;

routes = ['home','about','services','clients','articles','media','admin', '404'];

setRoutes = function(route) {
  var state, config;
  state = route;
  config = {
    url: '/' + route,
    templateUrl: 'views/' + route + '.html',
    controller: function($scope, $state){
      $scope.thisData = route + " Data";                
    }
  }
  $stateProvider.state(state, config);
  return $stateProvider;
};

routes.forEach(function(route) {
      console.log(route);
      return setRoutes(route);
  });
irth
  • 1,696
  • 2
  • 15
  • 24

1 Answers1

1

The ui-router is not working (by design, by intention) with ng-include and ng-controller. These are different concepts.

Basically, one of your states will be rendered at time. There could be even more views inside one state:

Or there could be hierarchy of them - so at one time we can see a grandchild state ('root.list.detail') with all its ancestors.

Here are pointed out all the essential resources to go through to understand ui-router properly:

once we do have defined all the states (as in the question above) we can start to create links to navigate to these states:

// using href
<a href="#/home">home
<a href="#/about">about
// using ui-sref
<a ui-sref="services">services
<a ui-sref="clients">clients

And these will be injected into index.html (root doc) where the <div ui-view=""></div> is defined.

Community
  • 1
  • 1
Radim Köhler
  • 122,561
  • 47
  • 239
  • 335
  • Thank you Radim. This is an informative reply and will likely help many people understand ui-router better. I agree with everything you're saying, however I'd still like a way to trivially access the various state's controllers on the SPA part of the app (homepage). The smoothest solution so far is to have a service that takes various controller $scopes and then that could sync with the homepage controller. Another alternative would be using the data or resolve properties but I'm looking for a more inline html answer if available. (without resorting to litter $rootScope) – irth Sep 10 '14 at 10:17
  • 1
    I wish to help. But I'm trying to say, that this won't work at the end. The `ui-router` is representing different world/approach. You still can create named controllers, repeating the array of states and calling the `.controller(stateName + 'Ctrl', function...)`. Then you will pass that name into state def... but states view and contollers do not belong to ng-include... – Radim Köhler Sep 10 '14 at 10:24
  • I see but doesn't Angular register the controller? If so, then I just need to find out the controller name that ui-router generates. – irth Sep 10 '14 at 20:36
  • I've made a feature request on github for getting a controller name from ui-router. meanwhile, followed your advice and made a loop that creates controllers at runtime via $controllerProvider and added this controller to each separate page element and state. now the homepage ng-includes shares the same controllers as routed states. Appreciate your guidance, Radim! – irth Sep 10 '14 at 23:04
  • I do admire your will to find solution. You did it, but please, be ready to re-think that approac. Some of your controllers could *(sooner or later)* be part of a parent/child state def, expecting some stuff in its $scope - assigned by parent controller/resolver... Just trying to tell, that if you will re-evaluate your needs, I am sure that YOU will make it working with `ui-router` features only. Great to see such a will... good luck sir ;) – Radim Köhler Sep 11 '14 at 04:00
  • Thanks again, Radim.. I'll consider structuring routing the app with named views in the main state. This would be the preferred solution, I understand the concept better now. Cheers and good luck as well with w/e it is! – irth Sep 11 '14 at 08:46