Question

我使用的是ui-router 1.0.0和angularjs 1.4.2。我想实现显示错误页面的常规行为：

我正在查看州/ foo
我点击/ bar，解决方案最终导致500错误（后端）
网址更改为/ bar并显示错误页面（网址仍为/ bar）

当然，如果我在浏览器中直接输入/ bar url，我希望看到同一页面。历史按钮也应按预期工作。我已经尝试了以下代码，但网址没有变化，与/ foo保持一致。

$transitions.onError({},
  function () {
    $state.go('error', null, { location: false });
  }
);

这怎么可能？

Answer 1

使用示例网址：

'/ foo'-正常运行状态
'/ bar'-因500而拒绝解决的状态

如果直接导航到“ / bar”，则该功能应已按预期工作。该网址将为“ / bar”，您可以在该页面上显示错误状态

如果从'/ foo'导航，那么我还没有找到任何方法来告诉ui-router如果拒绝解决将URL更改为目标状态的URL，但是我确实找到了解决方法：

在onError中，将URL手动更改为目标状态的URL。
这将触发向同一目标的新过渡，这将再次导致onError，因此，如果目标路径已经与当前路径匹配，则我们需要确保不执行其他URL更改（存在无限循环的可能在这里）

例如：

const targetState = transition.targetState().name;
const targetHref = $state.href(targetState);
const currentPath = $location.path();

if (targetPath !== currentPath) {
    //  This triggers a new transition to the same state, but with the URL already changed
    // (so that the URL represents the target state even if the transition is rejected)
    $location.path(targetPath);
} else {
    // In this case we're on the target URL for this failed transition, and we
    // show our error state while leaving the user's intended URL in place
    $state.go('error', null, { location: false });
}

如何使用ui-router显示错误页面，在从先前状态导航时更改URL？

1 个答案: