$ stateParams restituisce undefined

Question

Ho questi percorsi definiti:

.state('sport', 
     url: '/sport' 
     templateUrl: '/templates/sport' 
     controller: 'SportCtrl' 
    ) 
    .state('sport.selected' 
     url: '/:sport' 
     templateUrl: '/templates/sport' 
     controller: 'SportCtrl' 
    ) 

E ho questo controller cercando di utilizzare la: lo sport param data dalla Stato sport.selected.

 angular.module('myApp') 
     .controller('SportCtrl', ['$scope', 'ParseService', 
        '$stateParams', function ($scope, ParseService, $stateParams) { 

      var sportURL = $stateParams.sport; 

     ... 
    }); 

Per qualche ragione, restituisce il valore undefined quando chiamo $ stateParams.sport nel controller, anche se penso che ho definito nelle rotte. Perché è così?

Grazie per il vostro aiuto!

Answer 1

Quando si accede alla URL /sport/12, il SportCtrl vengono istanziati due volte: una per lo stato sport, e una volta per lo stato sport.selected. E per il primo stato, non esiste alcun parametro associato allo stato, quindi $stateParams.sport non è definito.

Si noti che è piuttosto strano utilizzare lo stesso modello per uno stato e un sotto-stato. Avrai il modello incorporato nel div Ui-view dello stesso modello.