So erhalten Sie die Parameter des ui-routers bei der Aktualisierung des Browsers

Question

verwende einen eckigen UI-Router, um die Zustände meines SPA zu verwalten. Ich habe diesen Weg:

.state('index.administration.security.roleEdit', { 
       url: '/roleEdit', 
       templateUrl: 'app/administration/security/role/roleEdit.html', 
       controller: 'roleEditCtrl', 
       controllerAs: 'roleEditCtrl', 
       params: { data: null }, 
       resolve: { 
        role: function ($stateParams) { 
         return angular.fromJson($stateParams.data); 
        }, 
        modules: function (securityService) { 
         return securityService.getAllModules(); 
        }      
       } 
      }) 

Auch ich bin in den Zustand ‚Daten‘ Parameter als JSON-Objekt übergeben. Jetzt, wenn ich diesen Zustand zum ersten Mal lade, ist alles in Ordnung. Aber wenn ich Browser aktualisieren (F5-Schlüssel) ist die $ stateParams.data Null in der Auflösungsfunktion des Staates.

Wie kann ich das lösen? Ich sehe diese möglichen Lösungen: 1. Persistent irgendwie Parameter 2. Override Browser aktualisieren (weiß nicht wie), um den Browser zu stoppen, die App zu aktualisieren. 3. Beim Aktualisieren auf anderen Geschwisterstatus.

Bitte helfen

UPDATE Ok, ich Daten wie folgt festgelegt:

vm.editRole = function(roleId){ 
    var role = dataService.getRoleById(roleId).then(function(result){ 
      $state.go('roleEdit', {data:angular.toJson(result)}); 
      }); 
} 

UPDATE 2 Der roleEdit-Controller sieht wie folgt aus:

(function(){ 
    angular.module('app.administration').controller('roleEdit', 
    ['role','modules', '$scope', 'securityService', '$state', roleEditCtrl]); 

    function roleEditCtrl('role', 'modules',$scope, securityService, $state){ 
     var vm = this; 
     vm.roles = roles; 
     vm.originalRole = angular.copy(role); 
     vm.modules=modules; 
     vm.saveChanges = _saveChanges; 
     vm.cancel = _cancel; 

     return vm; 

     function _saveChanges(){ 
      securityService.UpdateRole(vm.role).then(function(result){ 
       $staste.go('^.roles'); 
      } 
     } 

     function _cancel(){ 
      vm.role = angular.copy(vm.originalRole); 
      $sscope.roleEditForm.$setPristine();    
     } 
    } 
})(); 

Answer 1

würde ich Bleiben Sie weg von der Option 2. Sie wollen nicht vermasselt das erwartete Verhalten eines Browsers.

Vielleicht könnten Sie Ihre Daten in Ihre Entschlossenheit Objekt ala Refactoring:

resolve: { 
      role: function ($stateParams) { 
       return angular.fromJson($stateParams.data); 
      }, 
      modules: function (securityService) { 
       return securityService.getAllModules(); 
      }, 
      data: function (dataService) { 
       return dataService.retrieveStoredData(); 
      } 

Wo Ihr Data ein Service, den Sie, dass die Daten zu speichern, verwenden würde, wenn es wirklich so wichtig ist (durch Cookies oder local).

Es gibt keine vernünftige Möglichkeit zu erwarten, dass dieses Feld bei der Browseraktualisierung gefüllt wird, wenn Sie zuvor JavaScript ausgeführt haben, um statusbehaftete Werte an es zu übergeben.

Answer 2

Hatte das gleiche Problem, lassen Sie dies hier, falls jemand anderes es braucht. Gelöst mit localStorage.

Ich habe diesen Satz als Teil run App-Methode

$rootScope.$on('$stateChangeSuccess', function (event, toState) { 
    localStorage.setItem('__stateName', toState.name); 
}); 

nun je nach Struktur Ihrer App Sie das irgendwo setzen sonst vielleicht zu prüfen, aber in meinem Fall hatte ich Eltern AppController alle umliegenden Kinder-Controller, so dass dieser Teil des Codes dorthin ging. Grundsätzlich

var previousState = localStorage.getItem('__stateName'); 
previousState && $state.go(previousState) || $state.go(<SOME_OTHER_ROUTE>); 

, wenn Benutzer Aktualisierung des Browsers trifft, erhalten AppController von Anfang an initialisiert (bevor Kind-Controller), das Brennen des Zustandsübergang sofort, wenn es einer war. Sonst würdest du in einen anderen Zustand von dir gehen.