angular ui router - muss zweimal klicken, damit die Ansicht wie erwartet aktualisiert wird (mit Demo)

Question

Ich bin ein Neuling mit Angular und habe gerade das AngularUI Router-Framework in den Griff bekommen. Ich habe eine HTML-Seite, die eine Liste von Fragen enthält (jede Frage benötigt eine eigene URL) und eine Ergebnisseite.

Ich habe eine schnelle abgespeckte Plunker (mit allen Dateien) erstellt, das Problem Demo:

http://plnkr.co/edit/QErnkddmWB0JgendbOiV?p=preview

Für SO Ref:

app.js

angular.module('foo', ['ui.router']) 

.config(function($stateProvider, $urlRouterProvider) { 

    $urlRouterProvider.otherwise('/q1'); 

    $stateProvider 

    .state('question', { 
     url: '/:questionID', 
     templateUrl: 'questions.html', 
     controller: 'questionsCtrl' 
    }) 

    .state('results', { 
     url: '/results', 
     templateUrl: 'results.html' 
    }) 

}) 

.controller('questionsCtrl', function($scope, $stateParams) { 

    $scope.questionID = $stateParams.questionID; 
    $scope.scotches = [ 
     { 
      name: 'Macallan 12', 
      price: 50 
     }, 
     { 
      name: 'Chivas Regal Royal Salute', 
      price: 10000 
     } 
    ]; 

}); 

Grundsätzlich Aus irgendeinem Grund (für mich) muss ich zweimal auf den Link "Ergebnisse" klicken, damit er in meinen Augen erscheint ufld erscheint beim ersten Klick.

Weiß jemand, warum das passiert?

A.

Answer 1

Was sollten wir tun, ist, den Zustand defintion zu umkehren:

.state('results', { 
    url: '/results', 
    templateUrl: 'results.html' 
}) 
.state('question', { 
    url: '/:questionID', 
    templateUrl: 'questions.html', 
    controller: 'questionsCtrl' 
}) 

Der Grund, warum?

weil die Frage Zustand Definition deckt auch die /results als param /:questionID

Aber in der Regel ist dies immer noch verwirrend ist, so würde ich die URL mehr, zum Beispiel unterscheiden mit /question keyword

.state('results', { 
    url: '/results', 
}) 
.state('question', { 
    url: '/question/:questionID', 
    ... 
})