URL out of sync with ng-view after a $routeChangeError

[butchpeters]

1. Configure a route (e.g. '/causesError') containing a resolve property
2. Load a good state in your application (e.g. the route '/goodRoute')
3. User performs an action to load the route '/causesError'
4. The resolve gets rejected, which causes $routeChangeError to be broadcast rather than $routeChangeSuccess.

Because there was no $routeChangeSuccess, the ng-view still contains content for '/goodRoute', but now the URL is changed to the failed route. They are out of sync.

Any attempt to change the URL back to '/goodRoute' in a $routeChangeError event handler would cause the '/goodRoute' to reload, which is not desirable.

One problem this causes is now the user can't retry the action that caused the error. In a mobile application, for example, they may have been experiencing intermittent connection loss. If they retry the same action, the location change events won't fire because the URL isn't changing, and therefore the route won't be reattempted.

[fozzle]

Does anyone have a decent solution for this problem?

[xMysteriox]

It would be great if this could be fixed somewhere along the line...

[marcalj]

+1

[dogancelik]

I have the same issue. My current solution is:

$rootScope.$on "$routeChangeError", (event, current, previous, rejection) ->
  $location.path(if not angular.isUndefined(previous) then previous.originalPath else "/")

There are two options here:

1. If user goes to /causesError without a referrer, user will be redirected to / (home page).
2. If user goes to /causesError from a link, user will be redirected to the last route (in this case: /goodRoute).

[austingreco]

Just a note: the above code won't work for routes with parameters, originalPath would contain the literal /goodRoute/:param

[dogancelik]

Oh I didn't notice that, thank you. Here's a little fix, I don't know how to do this the Angular way:

previous.originalPath.replace(/:(\w+)/g, (match, param) -> previous.pathParams[param])

[bbshopadmin]

+1 need a clean solution too

[bbshopadmin]

In case of rejected resolve on route change: there is a needless entry in the history and a wrong location is shown. Any ideas?

[bbshopadmin]

I can't believe not finding a solution for that issue. In my case i don't want to redirect to error pages, so i want to stay in the current view.

Is route resolve simply unusable? What i'm overlooking?

[just-boris]

What about to show route defined as otherwise case? It is intended to be shown when other routes can't do it.
I think, that is good solution, because usually there is described a fallback page for wrong route. It will be much better than loading previous path when I have to listen $routeChangeError and show error message manually.

[bbshopadmin]

For now i redirect to an error view, though i'd like to handle route change errors messages via popup or something like that.

[just-boris]

The main reason, why I don't use pop-ups for error, it that is when opening page with error by direct link you will see the only small block instead of full-page message.
For example, my app has route '/project/:id' and if I request non-existing id and server returns an error I want to show 404 page for user, and this is common use case of my routes.
Could you provide your example where you need your behaviour?

P.S. Popups is only useful when you have a deal with request without route change, e.g. form submit or pagination. In this case current view may has an unsaved user data, which cannot be lost.

[bbshopadmin]

@just-boris I use angular-http-auth and $route resolve. I tried to explain my issue here: witoldsz/angular-http-auth#55 .

[just-boris]

Very interesting. +1 for the route reload usage.
With authorization I see the following steps:

1. User clicks on link, requiring authorization.
2. Server respond 401 error
3. We capture this error and show auth form.
4. There two ways:
   • User successfully logged in: call $route.reload().
   • User clicks cancel: call $window.history.back(); to get previous page.

My scheme ideally covers this case