UI-Router aktualisiert die URL in der Adressleiste nach erfolgreicher Statusänderung nicht

Question

Ich baue eine kleine eckige App und verwende derzeit ui-Router.

Ich bin auf ein Problem gestoßen, das schrecklich wie ein Fehler im UI-Router aussieht, aber ich kann nicht sicher sein, da ich mit dieser Bibliothek nicht so vertraut bin.Wenn der Benutzer auf einen bestimmten Link klickt, wird die URL in der Adressleiste nicht aktualisiert, obwohl der korrekte Ansichtsstatus wie erwartet geladen wird.

Ich benutze UI-Router ui-sref anweisung zum automatischen Generieren der URL für den Status.Zum Beispiel verwende ich in der Listenansicht der Checkliste den folgenden Code:

<a ui-sref="checklist-phase({ aircraftId: checklist.aircraft, checklistId: checklist.id, phaseSlug: checklist.phases[0].slug })" ng-bind="checklist.name"></a>

Ich habe meine App verkleinert und zu einem Plunker gemacht, damit das Problem hoffentlich von anderen reproduzierbar ist.Das Problem kann auch in diesem Video beobachtet werden: https://www.youtube.com/watch?v=EW9CFe6LfCw

Reproduktionsschritte:

1. Gehe zu http://run.plnkr.co/plunks/ZqMIYNU6abEAndAM5nx1/#/aircraft/1/checklists
2. Klicken Sie auf den ersten Link.Beachten Sie, dass die Ansicht aktualisiert wird, um den korrekten Status anzuzeigen, die URL jedoch unverändert bleibt /#/aircraft/1/checklists.

Was seltsam ist, ist, dass das Zurücknavigieren in diesen Status auf andere Weise die URL perfekt aktualisiert.Zum Beispiel (vorausgesetzt, die obigen Schritte 1 und 2 wurden befolgt):

1. Scrollen Sie nach unten und klicken Sie auf das Symbol Next Phase verknüpfen.Beachten Sie, dass sich der Status ändert und die URL aktualisiert wird.
2. Scrollen Sie in dieser neuen Ansicht nach unten und klicken Sie auf Previous Phase.Beachten Sie, dass der vorherige Status neu geladen wird und diesmal die URL korrekt aktualisiert wurde.

Verwende ich den UI-Router falsch oder mache ich etwas anderes falsch, um dieses Verhalten zu verursachen?

Answer 1

Check hier aktualisierte Version

Auf Ihren Zustand 'check-lists' sie stellen ui-sref bereit für 'checklist-phase'

<a ui-sref="checklist-phase({ aircraftId: ...

Und die 'checklist-phase' ist definiert als ein untergeordneter Zustand von 'checklist-detail'

.state('checklist-phase', {
    parent: 'checklist-detail',

Und der Staat 'checklist-detail' hat Controller, der $ state aufruft.gehen

.state('checklist-detail', {       
    controller: 'ChecklistDetailCtrl',
    ...

    .controller('ChecklistDetailCtrl', function ($scope.... 
    {

        $state.go('checklist-phase', {
            phaseSlug: checklistData.phases[0].slug
        }, {
            location: 'replace'
        });

Tu das NICHT...entfernen sie einfach die $state.go - weil Sie bereits zum Navigieren checklist-phase (siehe die ersten Zeilen oben) ...überprüfen Sie es hier