AngularJS zum Browser-Verlauf hinzufügen ohne Seiten-Reload und ohne HTML5-Push-Status

Question

Ich habe eine Suchseite, die es dem Benutzer ermöglicht, in Kategorien zu suchen und/oder Suchbegriffe einzugeben. Ich möchte dem Benutzer die Möglichkeit geben, die Zurück-Schaltfläche zu verwenden, um diese Aktionen rückgängig zu machen. Wie kann ich mit AngularJS diese Seite für jede dieser Aktionen zum Browserverlauf hinzufügen lassen? Ich kann HTML5-Pushstate nicht verwenden.

Answer 1

ich fand ich unter Verwendung der Antwort über reloadOnSearch von here die Query-String-Parameter zu ändern, ohne die Seite neu zu laden dies tun können:

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

Und dann, aus derselben Antwort, die Einstellung der Query-String verwenden:

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

Und schließlich Route Erkennen von Änderungen durch die Antwort von here mit:

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

Answer 2

Sie können den HTML5-Modus mit $locationProvider.html5Mode(false) deaktivieren.

Dann verwenden Sie einfach Hashbang URLs wie <a href="#!/search">Search</a>, diese werden zum Verlauf des Browsers hinzugefügt.

Answer 3

Ich glaube nicht, dass es möglich ist, Einträge in den Browserverlauf ohne Verwendung von HTML5-Pushstate (zumindest, ohne tatsächlich den aktuellen Speicherort zu ändern) hinzuzufügen.

Die MDN Seite diskutiert die Einführung von pushstate und wie sie diese neue Funktionalität ermöglicht (was bedeutet es bisher nicht möglich war): https://developer.mozilla.org/en-US/docs/Web/Guide/API/DOM/Manipulating_the_browser_history

EDIT: Wenn der Grund, warum Sie nicht HTML5 pushstate verwenden können, ist, weil Browser-Unterstützung finden Sie in diesem polyfill: https://github.com/browserstate/history.js

Answer 4

Zusammen mit der reloadOnSearch unter Code, um das Ereignis der Standortänderung zu verfolgen arbeitete für mich.

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

Obwohl es vielleicht für jemand helfen.