AngularJs:ui.router不加载控制器

时间:2015-01-29 03:39:05

标签: angularjs angular-ui-router

我尝试将AngularJs与ui.router一起使用,但遇到了麻烦。

此示例有三种状态:index,template和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'
  })

请参阅plunker:http://plnkr.co/edit/prluQs9vXeJw9IVi2JYW?p=info

但只有两个第一州工作。州&#34; template.show&#34;更改,加载模板,但不执行 TemplateShowCtrl和不更新 ui-view到新模板。

您可以看到screenshot

1 个答案:

答案 0 :(得分:5)

任何子状态都要求在其父级中存在后续ui-view指令,以便它知道在何处插入html。目前,template_index.html标记中没有一个存在。

它应该看起来像这样:

<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>