角度 ui-router 1.0.0rc 转换在重定向上被取代



Angular 1.6.1 和 ui-router 1.0.0rc;

我在从一个状态重定向到另一个状态时遇到了 ui 路由器问题。

TransitionRejection已注册,因为它已被取代。

Transition #1 r0: Started  -> "Transition#1( 'intro'{} -> 'foo'{} )"
Transition #1 r0: <- Rejected "Transition#1( 'intro'{} -> 'foo'{} )", reason: TransitionRejection(type: 2, message: The transition has been superseded by a different transition, detail: 'bar'{"id":"uuid-1234-uuid"})
Transition #2 r0: Ignored  <> "Transition#2( 'intro'{} -> 'intro'{} )"
Transition #3 r0: Started  -> "Transition#3( 'intro'{} -> 'bar'{"id":"uuid-1234-uuid"} )"
Transition #3 r0: <- Success  "Transition#3( 'intro'{} -> 'bar'{"id":"uuid-1234-uuid"} )", final state: bar

注意:全局有一个 catch all,当用户在加载状态时未解析时,它用于身份验证控制:

// state 'intro' is '/'
.config($urlRouterProvider => {
$urlRouterProvider.otherwise('/'); 
})
.run(($transitions, $trace) => {
$trace.enable('TRANSITION');
$transitions.onError({}, trans => trans.router.stateService.go('intro'));
}

过渡代码段

// there is no foo component, it's a straight redirect
.component('bar', {
template: someTemplate,
controller: someCtrl
})
.config($stateProvider => {
let states = [
{
name: 'foo',
url: '/foo',
redirectTo: { state: 'bar', params: { id: 'uuid-1234-uuid' } }
},
{
name: 'bar',
url: '/bar/:id',
component: 'bar'
}
];
states.forEach(s => $stateProvider.state(s));
})

虽然在这个intro -> foo的例子中,它最终会处于正确的状态bar,但其他转换(当不是从intro(default)bar,而是从baz, qux, ..bar)最终进入一个无限的过渡循环。

例如,从quxfoo,应该重定向到bar,但陷入qux -> intro循环:(我没有更早的qux -> foo错误消息,因为浏览器崩溃了)

TransitionRejection(type: 2, message: The transition has been superseded by a different transition, detail: Transition#2704( 'qux'{} -> 'intro'{} ))

有没有人有重定向的解决方案,或者可以看到我是否正确使用了全局捕获?Catch all 导致了死亡循环,但这是首先触发它的重定向拒绝问题的次要问题。

当您尝试在上一个状态更改事件完成之前触发状态更改时,会发生转换取代错误。 解决此问题的一种简单方法是在超时后调用状态更改。这允许完成当前状态更改,然后触发下一个状态更改。

$timeout(function(){
$state.go('statename')
})

注意:这里的超时没有定义时间,这仅仅意味着它将在所有当前进程完成后执行

如果你从转换钩子返回目标状态而不是使用 stateService.go,那么就我目前对 ui-router 的理解而言,这个问题应该会消失。

在 1.0.20 版中 使用 trans.router.stateService.target('sth') 而不是 $state.go('sth)

最新更新