L'INTERFACE utilisateur du Routeur ne parvient pas à mettre à jour l'URL dans la barre d'adresse après le succès de changement d'état

Question

Je suis en train de construire un petit Angulaire app et je suis actuellement à l'aide de l'interface utilisateur du routeur.

J'ai frappé un problème qui semble affreusement comme un bug dans l'interface utilisateur du routeur, mais je ne peux pas être sûr que je ne suis pas familier avec cette bibliothèque.Lorsque l'utilisateur clique sur un lien spécifique, bien que la vue correcte de l'état est chargé comme prévu, l'URL dans la barre d'adresse n'est pas mis à jour.

Je suis l'aide de l'interface utilisateur du routeur ui-sref directive pour générer automatiquement l'URL de l'état.Par exemple, dans la liste afficher j'utilise le code suivant:

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

J'ai coupé mes app et en a fait un Plunker donc, le problème est probablement reproductible par d'autres.Le problème peut également être observée dans cette vidéo: https://www.youtube.com/watch?v=EW9CFe6LfCw

Reproduction suit:

1. Aller à http://run.plnkr.co/plunks/ZqMIYNU6abEAndAM5nx1/#/aircraft/1/checklists
2. Cliquez sur le premier lien.Notez que la vue est mise à jour et le bon état, mais l'URL reste à /#/aircraft/1/checklists.

Ce qui est étrange, c'est que la navigation de retour à cet état par d'autres moyens les mises à jour de l'URL parfaitement.Par exemple (en supposant que les étapes 1 et 2 ci-dessus ont été respectées):

1. Faites défiler vers le bas et cliquez sur le Next Phase lien.Notez que les modifications de l'état et de l'URL de mise à jour.
2. Faites défiler vers le bas sur ce nouveau point de vue et cliquez sur Previous Phase.Notez que l'état précédent de recharge et cette fois l'URL correctement mis à jour.

Suis-je à l'aide de l'interface utilisateur du routeur de manière incorrecte ou de faire quelque chose d'autre incorrecte à cause de ce comportement?

Answer 1

Vérifier ici version mise à jour

Sur votre état 'check-lists' vous fournissez l'interface utilisateur-sref à 'checklist-phase'

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

Et la 'checklist-phase' est définie comme un état d'enfant de 'checklist-detail'

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

Et l'état 'checklist-detail' a contrôleur qui appelle $état.aller

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

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

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

Ne fais PAS ça...il suffit de retirer le $state.go - parce que vous êtes déjà la navigation à l' checklist-phase (voir les premières lignes ci-dessus) ...vérifier ici