Changing state without changing browser history in angular ui-router

Question

Assume that we have a logic like this:

• From state A, change to state B.
• Whenever we arrive to state B, the app always redirect us to state C by calling $state.go(stateC)
• Now we are in state C

My question is how to go back to state A from state C (given the fact that state A can be any state we don't know at run-time, meaning user can access state B from any other states)

Answer 1

Use the location option with value "replace"...

$state.go(stateC, null, {
    location: 'replace'
})

See https://angular-ui.github.io/ui-router/site/#/api/ui.router.state.$state#methods_go

location - {boolean=true|string=} - If true will update the url in the location bar, if false will not. If string, must be "replace", which will update url and also replace last history record.

Answer 2

You could keep track of visited states in a service and then just call $state.go on the previous state.

You can watch the state changes like so:

$rootScope.$on('$stateChangeStart', 
function(event, toState, toParams, fromState, fromParams){ 
    // add fromState to history 
});

How to $watch state change of $stateProvider in AngularJS?