Avere genitore di default stato a stato figlio utilizzando ui-router

Question

ho questa struttura statale:

.state('places', 
{ 
    url:'/places', 
    controller:'PlacesController', 
    templateUrl:'views/places.html' 
}) 
.state('places.city', 
{ 
    url:'/:city', 
    templateUrl:function(stateParams) 
    { 
     return 'views/places/'+stateParams.city+'.html'; 
    } 
}); 

E funziona bene, tranne quando l'URL è semplicemente /places senza una città dopo di esso.
Come posso avere un valore predefinito per templateUrl nello stato bambino?

Sto pensando che il modo migliore sarebbe quello di impostare l'interfaccia utente da PlacesController, tuttavia ciò non sembra possibile.

Answer 1

Come indicato nella pagina Angular-UI Wiki:

Ci sono tre modi per attivare uno stato:

1. chiamata $ state.go(). Metodo di convenienza di alto livello.
2. Fare clic su un collegamento contenente la direttiva ui-sref.
3. Passare all'URL associato allo stato.

https://github.com/angular-ui/ui-router/wiki#activating-a-state

Answer 2

Prova definire un altro stato bambino con l'URL impostato su una stringa vuota:

.state('places.default', { 
    url: '', 
    templateUrl: '...' 
} 

Quindi aggiungere abstract: true allo stato genitore.

Answer 3

Senza bisogno di alcun cambiamento nella configurazione stati, si può mettere il modello predefinito direttamente tra le ui-view tag nel codice HTML:

<!-- places.html --> 
<div ui-view> 
    <h1>Please choose a place</h1> 
</div> 

<!-- london.html --> 
<h1>London is amazing!</h1> 

Ora, quando si passa a /places , vedrai il messaggio "Scegli un luogo" e quando navighi su /places/london vedrai "Londra è incredibile!".

Answer 4

come dichiarato da Aaron è possibile utilizzare $ Stato per passare a uno stato infantile di default ma qui c'è un problema dici si supponga di avere più di 1 bambino:

.state('places', 
    { 
     url:'/places', 
     controller:'PlacesController', 
     templateUrl:'views/places.html' 
    }) 
    .state('places.city', 
    { 
     url:'/:city', 
     templateUrl:function(stateParams) 
     { 
      return 'views/places/'+stateParams.city+'.html'; 
     } 
    }) 
    .state('places.child2', 
    { 
     url:'/:city2', 
     templateUrl:function(stateParams) 
     { 
      return 'views/places/'+stateParams.child2+'.html'; 
     } 
    }); 

e in voi regolatore genitore PlacesController hai $ state.go (places.city) allora ogni volta che il controller genitore cioè PlacesController viene richiamato sarete reindirizzati alla città-stato. Quindi, se qualcuno si trova nello stato child2 e preme un pulsante di aggiornamento, il controller genitore verrà richiamato e verrà reindirizzato in una città che non è quello che desideri!

ANS: modo da poter controllare per lo stato attuale prima di fare una redirezione cioè se la persona è in stato di genitore poi reindirizzare a qualsiasi stato figlio di default, ma se la persona è in uno qualsiasi degli stati figlio allora non lo fanno il reindirizzamento nel controllore genitore: -

if($state.current.name == "places"){ 
    $state.go('places.city'); 
} 

spero che questo aiuti!

Answer 5

Usa determinazione dello stato genitore

.state('places', 
{ 
    url:'/places', 
    resolve: { default: function($state) { 
     if ($state.is('places')) $state.go('places.city', { url: 'london'}) 
    }} 
    controller:'PlacesController', 
    templateUrl:'views/places.html' 
}) 
.state('places.city', 
{ 
    url:'/:city', 
    templateUrl:function(stateParams) 
    { 
     return 'views/places/'+stateParams.city+'.html'; 
    } 
}); 

Verificare la presenza di errore di sintassi, io sono abituato a CoffeeScript :)