3

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

Vsevolod Avramov
  • 33
  • 4

1 Answers1

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>
scarlz
  • 2,512
  • 1
  • 17
  • 20