Angular 2 route async resolve does not keep the location on navigate

Question

I try to navigate user to error page when trying to access not allowed page. The problem is that the skipLocationChange does not work in this occasion. It navigates to error page but the url changes to the root. How to keep the original url user provided?

resolve(route: ActivatedRouteSnapshot): Observable<any|boolean>|boolean {
    return this.apiclientService.get('cars/' + route.params['id']).map(
        response => {
            if (response.data.user_id === this.authService.user().id) {
                return response.data;
            }

            this.router.navigate(['/404'], { skipLocationChange: true });
            return false;
        }
    ).catch(error => {
        this.router.navigate(['/404'], { skipLocationChange: true });

        return Observable.of(false);
    });
} 

Answer 1

The issue is that this.route is injected at the root level so it will be the root route.

You can traverse the routes to find the one you are intersted in.

Answer 2

I think skipLocationChange is actually working. The thing is Angular did not navigate to the new route because the guard failed. If you want to capture the failing URL, inspect the route: ActivatedRouteSnapshot param.