使用UI路由器显示404错误页面时如何不更改URL

Question

我想显示404错误页面，但是我想在位置中保存错误的URL。如果我要做这样的事情：$urlRouterProvider.otherwise('404');$stateProvider    .state('404', {        url: '/404',        template: error404Template    });网址将更改为/404。如何在不更改实际网址的情况下在错误的网址上显示错误消息？

Answer 1

有针对这种情况的解决方案。我们将使用1）一种ui-router本机功能和2）一种配置设置。这里可以看到一个有效的例子。

1）ui路由器状态定义的本机功能是：

该url是没有必要的。可以定义状态而无需在位置上表示。

2）配置设置为：

otherwise()对于无效的路由，该参数不必是具有默认url的字符串，但也可以是一个函数（引用）：

路径字符串| 函数要重定向到的URL路径或返回URL路径的函数规则。函数版本传递两个参数：$ injector和$ location

解决方案：两者结合。我们将state 没有 url and custom otherwise：

$stateProvider

  .state('404', {

    // no url defined

    template: '<div>error</div>',

  })

$urlRouterProvider.otherwise(function($injector, $location){

   var state = $injector.get('$state');

   state.go('404');

   return $location.path();

});

Answer 2

截至ui-router#0.2.15您可以使用$state.go()和发送选项不更新位置：

$urlRouterProvider.otherwise(function($injector) {

  var $state = $injector.get('$state');

  $state.go('404', null, {

    location: false

  });

});