4

I want to display a 404 page/component if my resolve guard fails, but I do not want the URL of the browser to change.

I can navigate without changing the URL in the resolve as described here by doing:

this.router.navigate(['/404'], { skipLocationChange: true })

This works when getting to this guard from within the app. However, if I navigate directly to the page, ex: /posts/1234 the router changes the URL to the fallback route (thought the 404 component is correctly displayed). If I do not skip location change, everything works as expected, but then I have '/404' in my url which I do not want.

Is there a way to achieve this with the router currently, or is it a bug?

tam5
  • 3,197
  • 5
  • 24
  • 45

1 Answers1

6

I'm facing the same problem. In the unlikely event you still want to solve this, I found this Github issue: https://github.com/angular/angular/issues/16981

Does't seem like there is a legit way to handle this, but there is a good workaround suggested by Karolis92

canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot):     Observable<boolean> {
   <...>
   this.router.navigate(['404']);
   setTimeout(() => this.location.replaceState(state.url));
   <...>
}
user3370237
  • 61
  • 1
  • 2
  • Indeed, we are doing something like this in the end. But it’s unfortunate this hasn’t been fixed yet – tam5 Jun 22 '18 at 20:08