UI-router--有一个路由的URL共享同一级别与$ stateParams另一种状态？ [英] ui-router-- having a route's URL share the same level as another state with $stateParams?

问题描述

我想要做这样的事情在我的应用程序，其中URL同级别击中无论是巴兹状态，即绝对的命名，或 BIZ 状态需要一个参数。

I'd like to do something like this in my application, where the same level of the URL hits the either the baz state, that absolutely named, or the biz state that takes a parameter.

angular.module('foo')
.config(function($stateProvider){
  $stateProvider
  .state('baz', {
    url: '/baz',
    templateUrl: '/templates/baz.html'
  })
  .state('biz', {
    url: '/:biz',
    templateUrl: '/templates/biz.html',
    resolve: {
      biz: function($stateParams){
        // resolve whatever $stateParams.biz should be
      }
    }
  })
})

然而，正在发生的事情是UI的路由器的总是的一下 BIZ 状态，除preting巴兹作为参数对于状态。有一种优雅的方式让UI路由器知道什么击中/巴兹应解决的巴兹状态？

However, what's happening is ui-router is always hitting the biz state, and interpreting "baz" as a parameter for that state. Is there an elegant way to let ui-router know that anything that hits "/baz" should resolve to the baz state?

我知道我可以使用 $ stateChangeStart 键，做这样的事情：

I know I can use $stateChangeStart and do something like this:

$rootScope.$on('$stateChangeStart', function(event, toState, toParams){
  if (toParams.biz === "baz"){
    event.preventDefault();
    $state.go('baz')
  }
})

但是，这还远远优雅，似乎是一个黑客。

But this is far from elegant and seems like a hack.

推荐答案

我创建一个plunker这里，这实际上表明，那上面的状态的片断正在工作。为什么，因为这些国家都以正确的顺序定义的：

I created a plunker here, which in fact shows, that the above state snippet is WORKING. Why, because these states are defined in the correct order:

.state('baz', {
    url: '/baz', // url '/baz' is registered first, will be find and used
    ...
})
.state('biz', {
    url: '/:biz', // '/baz' will never reach this, because is already handled
    ...

我们如何使它破碎的方法，是高清切换状态：

The way how we can make it broken, is to switch the state def:

.state('biz', {
    url: '/:biz', // '/baz' will be handled by this state
    ...
.state('baz', {
    url: '/baz', // url '/baz' never reach this state def...
    ...
})

检查 rel=\"nofollow\">断开链接

Check the broken link here

摘要：

状态定义顺序很重要。 第一状态网​​址匹配使用

state definition order is important. The first state url match is used

这篇关于UI-router--有一个路由的URL共享同一级别与$ stateParams另一种状态？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！