angularjs - 在 Angular ui-router 子模板中不起作用

Question

我已注册状态 test带着 child .child1 ，这里 parent (test)工作正常。当我导航到状态 test.child1 URL 更改为 #/test/child1但 View 保持不变，子模板不起作用

angular.module('uiRouterSample.contacts', [
  'ui.router'
])

.config(
  [          '$stateProvider', '$urlRouterProvider',
    function ($stateProvider,   $urlRouterProvider) {
      $stateProvider
      .state('test',{
            url:'/test',            
            template:'<a ui-sref="test">Parent</a> -> <a ui-sref=".child1">child1</a>',
            controller: ['$scope', '$state', 'contacts', 'utils',
              function (  $scope,   $state,   contacts,   utils) {
              }]
        }).state('test.child1',{
            url:'/child1',            
            template:'Child template working fine'
        })
    }
  ]
)        

Answer 1

您需要一个 ui-view父状态(测试状态)模板中的指令:

  template:'<div ui-view/> <a ui-sref="test">Parent</a>  <a ui-sref=".child1">child1</a></div>',

基本上，每当您在 ui-router 中有一个状态将具有子状态时，该子状态的直接父级也必须具有 ui-view其模板中的指令。