UI路由器|暂停过渡| onBefore

时间:2017-01-17 23:45:31

标签: angular-ui-router transitions cancellation

如何取消onBefore中的转换?这个片段可能可以说明我的意图:

$transitions.onBefore({}, (trans) => {
    console.log("before a transition");
    console.log(trans);

    //I want to broadcast an event here
    //notifying inner components that it's about to switch state
    //The event will contain the trans
    //So I actually don't need to wait here, I just need to suspend the trans at this point.

    //The inner component will respond by emitting and event. 
    //That event will contain approval status, and the trans object. 
    //My code can simply check the approval status; If false,
    //it simply does nothing. Otherwise it will pick and resume the trans.
});

由于

2 个答案:

答案 0 :(得分:0)

想通了。这表明了这个想法。

首先,在boot.js / app.js中将window.counter设置为0,然后在控制器的$ onInit中设置为

$transitions.onBefore({}, (trans) => {
  if (window.counter == 0) {
    this.$timeout(() => trans.run(), 2000);
    window.counter += 1;
    return false;
  }
});

您首先会注意到您的转换已取消...,并在2秒后重新运行。

答案 1 :(得分:0)

TransitionHookFn返回HookResult。这可以是承诺推迟过渡直到承诺得到解决的承诺。

在这种情况下,我们可以执行以下操作:

$transitions.onBefore({}, $transitions => {
  return this.$timeout(() => {
    /*
     * Do something here. 
     * Once this is completed, transition can resume 
     * unless promise is rejected or resolves to a false value
     */
  }, 2000);
});

参考:https://ui-router.github.io/ng1/docs/latest/modules/transition.html#hookresult