Wie kann man den Zustandswechsel verhindern, wenn ein weiterer Übergang im eckigen Router läuft?

Question

In meiner eckigen App habe ich dieses Problem. Wenn der Benutzer schnell auf den Link doppelklickt (ui-sref-Link), wird der Zielstatus zweimal geladen. Dies wäre erträglich, wenn das Statusfenster nicht einfriert und auf andere Zustandsänderungen nicht mehr reagiert. Wenn Sie auf einen anderen UI-Sref-Link klicken, ändert sich die URL entsprechend, HTTP-Aufrufe im Hintergrund werden vorgenommen, aber die Ansicht wird eingefroren.

Ich muss wissen, wie kann ich einen Übergang verhindern, wenn es einen anderen Übergang bereits versucht, Versprechen zu lösen. Ich weiß, dass ich irgendwie mit $ stateChangeStart und event.preventDefault() arbeiten kann. Was ich nicht weiß, ist, wie ich meinen Übergang nach dem Auflösen des Auflösungsblocks und dem Gegenstück zu event.preventDefault() fortsetzen kann.

Danke für Ihre Zeit. Jeder Rat wird sehr geschätzt.

Answer 1

Das $ state Objekt des Angular UI Routers hat eine Eigenschaft 'transition', die vorhanden ist, wenn es sich in der Mitte eines aktiven Übergangs befindet. Eine Option besteht darin, das Attribut ui-sref zu entfernen und stattdessen ein ng-click-Attribut zu verwenden. Innerhalb Ihrer ng-click-Funktion können Sie vor dem Aufruf von $ state.go() eine manuelle Prüfung auf das Vorhandensein des Übergangsobjekts durchführen.

Vor

HTML:

<a ui-sref="Root.State1"> 

Nach

HTML:

<a href="" ng-click="goToStateOne()"> 

JS:

scope.goToStateOne = function() { 
    if (!$state.transition) $state.go('Root.State1'); 
}