在 ui-router 上对不同状态使用相同模板的问题

Question

我正在尝试对 2 个不同的视图使用相同的模板。我的设置是这样

$stateProvider.state('me', { 
    url: '/me', 
    templateUrl: 'partial/profile/profile.html',
    controller: 'ProfileController'
  });

  $stateProvider.state('myteam', { 
    url: '/myteam', 
    templateUrl: 'partial/myteam/myteam.html',
    controller: 'MyteamController' 
  });


  $stateProvider.state('myteam.teamMember', { 
    url: '/:username', 
    templateUrl: 'partial/profile/profile.html',
    controller: 'ProfileController'
  });

然而，每当我尝试访问 myteam.teamMember 时，URL 会发生变化，但视图不会发生变化。有人有什么建议吗？

Answer 1

当您重定向到 child 状态时，它会在当前状态 HTML 上查找 ui-view（它可以命名为视图），并在其中加载状态模板。基本上你正在重定向到 myteam 的子状态，所以要在视图中看到更改，你应该在 partial/myteam/myteam.html HTML 文件中的某个地方有 ui-view。

partial/myteam/myteam.html

<div>
 MY HTML

 ......

 .......

 <div ui-view></div>

</div>

在 ui-router 上对不同状态使用相同模板的问题

Issue with using the same template for different states on ui-router

angularjs

routing

angular-ui-router

angularjs-routing