Question

我的路由是：

$stateProvider.state('login', {
  url: '/login'
  views:
    appView:
      templateUrl: '/templates/login.html'
}).state('chooser', {
  url: '/chooser'
  views:
    appView:
      templateUrl: '/templates/chooser.html'
}).state('admin', {
  url: '/admin'
  views:
    appView:
      templateUrl: '/templates/admin.html'
}).state('admin.users', {
  url: '/admin/users'
  views:
    appView:
      templateUrl: '/templates/admin.html'
    adminView:
      templateUrl: '/templates/admin-users.html'
})

在我看来，我有：

  <ul class="nav nav-pills nav-stacked">
    <li><a ui-sref="admin.users">Users</a></li>
    <li><a href="#">Profile</a></li>
    <li><a href="#">Messages</a></li>
  </ul>

当我点击Users的链接时，它会转到/admin/admin/users而不是/admin/users。我做错了什么？

Answer 1

子状态确实继承了父URL。因此映射应如下所示：

.state('admin.users', {
  //url: '/admin/users'
  url: '/users'
  views:
    appView:
      templateUrl: '/templates/admin.html'
    adminView:
      templateUrl: '/templates/admin-users.html'
})

结果网址为/admin/users

另一个选项是重新启动网址评估，请参阅：Absolute Routes (^)：

如果您想要使用绝对网址匹配，则需要在网址字符串前加上一个特殊符号＆＃39; ^＆＃39;。

.state('admin.users', {
  //url: '/admin/users'
  url: '^/admin/users'
  views:
    appView:
      templateUrl: '/templates/admin.html'
    adminView:
      templateUrl: '/templates/admin-users.html'
})

Answer 2

状态应该如下所示继承路由。改变如下：

.state('admin.users', {
    url: '/users'
    views:
     appView:
       templateUrl: '/templates/admin.html' 
     adminView:
       templateUrl: '/templates/admin-users.html'
})

ui-router改变AngularJS中的路径

2 个答案: