AngularJS aggiungere alla cronologia del browser senza ricaricare la pagina e senza HTML5 pushstate

Question

Ho una pagina di ricerca che consente all'utente di eseguire il drill-down in categorie e/o immettere termini di ricerca. Voglio dare all'utente la possibilità di usare il pulsante Indietro per annullare queste azioni. Utilizzando AngularJS, come posso avere questa pagina aggiungere voci alla cronologia dei browser per ciascuna di queste azioni. Non riesco a utilizzare lo stato di stampa HTML5.

Answer 1

ho trovato che posso fare questo cambiando i parametri di stringa di query senza ricaricare la pagina utilizzando la risposta su reloadOnSearch da here:

$routeProvider 
    .when('/items', { 
    controller: 'ItemsCtrl', 
    templateUrl: '/templates/items', 
    reloadOnSearch: false 
    }, 
    ... 
); 

E poi, da quella stessa risposta, impostando la stringa query utilizzando:

$location.search('id', 123); 

Infine rilevamento cambia rotta utilizzando la risposta da here:

$scope.$on('$routeUpdate', function(){ 
    $scope.sort = $location.search().sort; 
    $scope.order = $location.search().order; 
    $scope.offset = $location.search().offset; 
}); 

Answer 2

È possibile disattivare la modalità HTML5 con $locationProvider.html5Mode(false).

Quindi utilizzare solo URL hashbang come <a href="#!/search">Search</a>, verranno aggiunti alla cronologia del browser.

Answer 3

Non credo sia possibile aggiungere voci alla cronologia del browser senza utilizzare lo stato di stampa HTML5 (almeno, senza cambiare effettivamente la posizione corrente).

pagina

Il MDN discute l'introduzione di pushState e come si permette questa nuova funzionalità (implicando che non era possibile prima): https://developer.mozilla.org/en-US/docs/Web/Guide/API/DOM/Manipulating_the_browser_history

EDIT: Se il motivo non è possibile utilizzare HTML5 pushState è perché di supporto del browser, vedere questo polyfill: https://github.com/browserstate/history.js

Answer 4

Lungo con il codice reloadOnSearch riportato di seguito per tenere traccia dell'evento di cambio posizione che ha funzionato per me.

$scope.$on('$locationChangeSuccess', function() { 
     $scope.sort = $location.search().sort; 
     $scope.order = $location.search().order; 
     $scope.offset = $location.search().offset; 
    }); 

Anche se potrebbe essere d'aiuto per qualcuno.