2015-07-02 11 views
5

Ich habe einen Zustand, der eine Autorisierung erfordert. Ich höre das $stateChangeStart Ereignis an und wenn das toState.data.protected und der Benutzer nicht autorisiert werden, rufe ich e.preventDefault() und $state.go('login') an.

Wenn ich die App in Root-URL öffne, werde ich automatisch in den geschützten Zustand umgeleitet. Das verursacht 10 $ Digest-Schleifen und ich lande im Login-Zustand, wenn ich die App in der Root-URL öffne und automatisch in einen geschützten Zustand umgeleitet werde.

Uncaught Error: [$rootScope:infdig] 10 $digest() iterations reached. Aborting!

dieses plnkr Siehe: http://plnkr.co/edit/1voh7m?p=preview

ich ohne Fehler in anderem Projekt mit Winkel 1.2.26 ähnlichen Code erfolgreich verwenden.

Beispielcode angular 1.4.1, ui.router 0.2.15:

//config block 
$urlRouterProvider.otherwise('/main'); 
$stateProvider 
.state('main', { 
    url: '/main', 
    templateUrl: 'main.html', 
    controller: 'MainController as main', 
    data: {'protected': true} 
}) 
.state('login', { 
    url: '/login', 
    templateUrl: 'login.html', 
    controller: 'LoginController as login' 
}); 

// in a run block 
$rootScope.$on("$stateChangeStart", function (event, toState) { 
    if (!event.defaultPrevented && toState.data && 
      toState.data.protected) { 
     // the user is not authorized, do not switch to state 
     event.preventDefault(); 
     // go to login page 
     $state.go('login'); 
    } 
}); 

Wissen Sie, was die Schleife verursacht?

Ich frage mich, ob das, was könnte wie folgt geschehen:

  1. der Übergangszustand
  2. starten Übergang Intercept main.submain Zustand
  3. UI-Router anmelden wird die Information, dass die erste transiotion bekam abgebrochen
  4. UI-Router läuft $urlRouter.update() und beginnt Übergang main.submain

EDIT: Vereinfachte Statuskonfiguration.

+0

Wo definieren Sie, welche Daten geschützt? – user3727843

+0

Verwenden der Zustandsdefinition: 'data: {'protected': true}' im Hauptstatus. Der Zustand wird prototypisch vererbt, so dass der Main-Main-Zustand den gleichen Wert hat. – kvetis

+0

Ich entschuldige mich, ich hatte eine falsche Plunk angefügt, die das Problem nicht gezeigt hat. – kvetis

Antwort

12

ist dies eine Frage der UI.Router - sehen Sie dieses Problem auf Github: https://github.com/angular-ui/ui-router/issues/600

Grundsätzlich, wenn Sie verwenden .otherwise('/main') (wies auch durch @Grundy out), dann wird die URL /main geändert, wenn der Pfad kann nicht gelöst werden. Nach $locationChangeSuccess ist mein Hörer aufgerufen und ich lehne die Umleitung mit event.preventDefault() ab. Dies führt dazu, dass die Position zurück in den unbekannten Pfad wechselt, wodurch bewirkt wird, dass der Ersatzpfad erneut verwendet wird. Dies verursacht die Endlosschleife. Die Lösung ist folgende:

$urlRouterProvider.otherwise(function($injector) { 
    var $state = $injector.get('$state'); 
    $state.go('main'); 
}); 

Sie können eine Funktion angeben, die mit $injector aufgerufen werden, und Sie können ohne Hin und her Lage Änderungen an Ihrem Hauptzustand (oder 404) umgeleitet werden. Danke an die Leute auf Github, ich hätte dort nachsehen sollen, bevor ich diese Frage gepostet habe.

Arbeiten zupfen: http://plnkr.co/edit/eQXaIk

+1

geholfen, vielen Dank! – Rantiev

Verwandte Themen