Come essere informati delle cancellazioni dei cambi di stato in ui-router?

Question

Quindi utilizzo l'interfaccia utente nella mia applicazione e sto usando il listener $stateChangeStart per mostrare un caricatore e lo $stateChangeSuccess per nascondere il caricatore. In questo modo ho un caricatore tra le transizioni di stato.

$rootScope.$on('$stateChangeStart', 
       function (event, toState, toParams, fromState, fromParams) { 
///show loader 
}); 

$rootScope.$on('$stateChangeSuccess', 
       function (event, toState, toParams, fromState, fromParams) { 
//hide loader 
}); 

Problema:

1. Sono in stato A
2. clicco su un pulsante per passare allo stato B, $stateChangeStart è chiamato per la B, viene mostrato il mio caricatore.
3. Immediatamente clicco su un altro pulsante per andare a dichiarare A (B ha alcune cose da determinazione, quindi non c'è tempo prima di B UI inizia effettivamente carico)
4. B non viene caricato, e $stateChangeSuccess non è chiamato e il mio caricatore è mai nascosto (Dato che eravamo già in a, non viene ricaricato)

Quindi c'è un modo posso ascoltare per cancellazioni di modifica dello stato e nascondere il mio caricatore?

Aggiornamento: Ho creato un Plunk. Nel plunk ho dato un timeout di 10 secondi nella risoluzione di B. Quindi, prima che si risolva, fare clic su A. Monitorare la console per eventi listener di modifica dello stato.

Aggiornamento 25 luglio 2015 che utilizza l'ultimo router AngularUI: Creato nuovo Plunk.

Answer 1

L'unica soluzione sostenibile che ho trovato finora è stata quella di evitare l'uso di ui-sref. Maschera il valore restituito di $state.go che è la chiave in questo caso.

Il trucco è quello di gestire il transition promessa restituito da $state.go

$scope.safeGo = function(stateName){ 
    var transition = $state.go(stateName); 
    transition.then(function(currentState){ 
    console.log('Transition finished successfully. State is ' + currentState.name); 
    }) 
    .catch(function(err){ 
    //revert your loader animation here 
    console.log('Transition failed. State is ' + $state.current.name, err); 
    }) 
} 

Lo stesso oggetto si può accedere tramite $state.transition proprietà comunque tra le transizioni la proprietà è null e in uno degli eventi che $state trasmissioni è anche null. Pertanto, l'unica opzione valida è prendere il valore restituito di $state.go.

Quando si seleziona Stato A prima B è stata risolta la promessa transition per B rifiuterà con un motivo Error: transition superseded. Tuttavia, sarà comunque necessario attendere fino al completamento di B.resolve. Se si desidera evitare di dover tenere traccia dei propri stati da soli, poiché la transizione a A verrà risolta immediatamente (perché lo stato corrente è ancora A mentre sta tentando di risolvere B).

Aggiornato plunker