UI的路由器 - 有一个路由的URL共享同一等级作为与$ stateParams另一种状态？(ui-

2019-10-21 06:03发布

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

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状态，并解释“巴兹”作为该状态的参数。有一种优雅的方式来让UI路由器知道什么击中“/巴兹”应解决的baz状态？

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

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

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

Answer 1:

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

.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
    ...

我们怎么可以把它折断的方式，是高清切换状态：

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

检查无效链接在这里

摘要：