如何防止 ui-router 参数覆盖？

Question

我目前正在一个有多个子路由的网站上工作，我想为用户配置文件创建一个简单的 url，例如：

mydomain.com/someusername

但是对于我当前的 UI-路由器状态配置，它会覆盖我所有其他 urls，我猜是因为它也将其他路由视为参数。

.state('profile', {
  url: '/{username}',
  template: '...',
  controller: '...',
})
.state('other', {
  url: '/other',
  template: '...',
  controller: '...',
});

（如本例中，'other' 状态将被视为配置文件状态中的参数）

我也尝试过从根状态对其进行子类化，但这也没有用。我可以通过在用户名前面使用一个额外的关键字（例如：mydomain.com/user/someusername）来解决这个问题，但从用户体验的角度来看，这有点复杂。

有没有办法像我一样做到这一点？

Answer 1

状态定义的顺序很重要..只需切换它们

// more specific
.state('other', {
  url: '/other',
  template: '...',
  controller: '...',
})
// more general
.state('profile', {
  url: '/{username}',
  template: '...',
  controller: '...',
})

UI-路由器正在将状态添加到队列中，然后迭代它以找到匹配项。所以如果一般是最后..更具体的会被正确找到

如何防止 ui-router 参数覆盖？

How to prevent an ui-router parameter override?

angularjs

angular-ui

angular-ui-router