angular-ui-router 1.0.x: event.preventDefault & event.defaultPrevented 替代答案

【问题标题】：angular-ui-router 1.0.x: event.preventDefault & event.defaultPrevented alternativeangular-ui-router 1.0.x: event.preventDefault & event.defaultPrevented 替代
【发布时间】：2017-05-10 09:32:11
【问题描述】：

我刚刚将$stateChangeStart 替换为$transitions.onStart

$rootScope.$on('$stateChangeStart', function(e, ...){
     e.preventDefault();
     // other code goes here...
});

到

$transitions.onStart({}, function(tras){
     // need a code equivalent to e.preventDefault
     // need a code to identify event.defaultPrevented 
     // other code goes here...

     // get parent states
     _o.util.getAncestorStates(toState.name, true).reverse()
        .forEach(function (state) {
           // certain condition to call event.preventDefault()

           if(event.defaultPrevented) {....}
     });
});

我想，我们可以通过添加 return $q.reject() 而不是 e.preventDefault() 来阻止转换，但我无法理解 return $q.reject() 下面的代码将如何执行。

另外，如何替换event.defaultPrevented？

我认为应该在transition.promise上做点什么但不清楚。

对不起，我看不懂官方文档 - https://ui-router.github.io/ng1/docs/latest/。谁能帮我找到更好的解释或替换上述代码？

【问题讨论】：

我认为你可以从 .onStart 中的 return false 取消转换..
好的，我刚刚添加了更多 sn-p 以了解为什么我需要 event.defaultPrevented - 我处理所有父状态并在特定条件下调用 event.preventDefault 并检查 event.defaultPrevented 是否有任何其他父州。
使用承诺链，如果前一个块取消，则后续 .then 块中的代码将被跳过。如果前一个处理程序取消转换，则永远不会调用 onStart 处理程序。 event.defaultPrevented 在 onStart 处理程序中永远不会是 true。相反，onError 处理程序链被调用，并且只有当且仅当event.defaultPrevented 为真时才会调用这些块。

标签： javascript angularjs angular-ui-router angular-ui angularjs-1.6

【解决方案1】：

您可以根据自己的逻辑选择以下两个选项之一：

从 angular-ui-router 1.0.3 开始，您可以使用$transition.abort()。如果您必须在异步调用后中止状态更改，则选择更简洁。
```
$transitions.onStart({}, function($transition) {
    $transition.abort();
    //more code...
});
```
另外，正如@tanmay 在 cmets 中所说，您可以使用简单的return false 来取消它。这也适用于非稳定版本（1.0.0.beta 和 1.0.0.rc）。 (Check it in ui-rooter docs)
```
$transitions.onStart({}, function($transition) {
    //code ...
    return false;
});
```

【讨论】：