2016-02-18 3 views
5

Viene visualizzato un messaggio di errore Confirm quando gli utenti fanno clic sul pulsante Back guardando l'evento $stateChangeStart. Considerare quanto segue:event.preventDefault() con Angularjs e UIRouter rimuove la cronologia del browser

Gli utenti navigano da pagina 1, 2, quindi pagina 3. A pagina 3, l'utente fa clic sul pulsante Back, viene visualizzata una finestra di conferma. L'utente fa clic sul pulsante Cancel, event.preventDefault() viene eseguito e l'utente rimane sulla stessa pagina. Quindi, se l'utente fa nuovamente clic su Back e sceglie OK la seconda volta, l'utente viene riportato alla pagina 1. Che cosa è successo a pagina 2? event.preventDefault() rimuove l'ultima cronologia? Come impedisco al browser di saltare la pagina precedente?

$rootScope.$on('$stateChangeStart', 
    function (event, toState, toParams, fromState, fromParams) { 
     var retVal = confirm("You have unsaved changes. If you leave the page, these changes will be lost."); 
     if (retVal == false) { 
      // user wants to cancel navigating back. 
      event.preventDefault();   
     } 
    }); 

risposta

0

Se ti piace tenere la storia, evitando Indietro fare clic sul pulsante che dovete fare che guardare $ locationChangeStart evento invece di $ stateChangeStart.

Questo perché $ stateChangeStart in contrasto con $ locationChangeStart viene convertito in serie dopo che la transizione è stata eseguita e la cronologia del browser è già stata aggiornata.

Così dovrebbe andare in questo modo:

$rootScope.$on('$locationChangeStart', function(event, next) { 
    var retVal = confirm("You have unsaved changes. If you leave the page, these changes will be lost."); 
    if (retVal == false) { 
     // user wants to cancel navigating back. 
     event.preventDefault();   
    } 
});