AngularJs: ui.router does not loading controller

Question

I'l try to use AngularJs with ui.router, but have the trouble.

This example have three states: index, template and template.show

$stateProvider
  .state('/', {
    url: '',
    template: '<a ui-sref="template">GoTo Template Index</a>'
  })
  .state('template', {
    url: 'template',
    templateUrl: 'template_index.html',
    controller: 'TemplateCtrl'
  })
  .state('template.show', {
    url: '/{templateId:[0-9]+}',
    templateUrl: 'template_show.html',
    controller: 'TemplateShowCtrl'
  })

Please, see plunker: http://plnkr.co/edit/prluQs9vXeJw9IVi2JYW?p=info

But only two first states working. State "template.show" changing, loading template, but does not execute TemplateShowCtrl and not update ui-view to new template.

You can see screenshot

scarlz · Accepted Answer · 2015-01-29 05:34:07Z

6

Any child state requires the presence of a subsequent ui-view directive in its parent so that it knows where to insert the html. Currently, there is not one present in the template_index.html markup.

It should instead look something akin to this:

<ul>
   <li ng-repeat="t in templates">
     <a ui-sref="template.show({templateId:t.id})" href='#'>
       {{t.name}}
     </a>
   </li>
</ul>
<!-- target element -->
<ui-view></ui-view>

answered Jan 29, 2015 at 5:34

scarlz

2,5121 gold badge19 silver badges20 bronze badges

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

1 Comment

Vsevolod Avramov Over a year ago

Thank you! I thought, that content will be replaced by new template

Collectives™ on Stack Overflow

AngularJs: ui.router does not loading controller

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related