Impossible d'obtenir les paramètres d'état du routeur ui
-
21-12-2019 - |
Question
Considérez la configuration ui-routeur suivante :
$stateProvider
.state('app', {
url: "/app",
abstract: true,
templateUrl: "templates/menu.html",
controller: 'AppCtrl'
})
.state('app.feed', {
url: "/feed",
views: {
'menuContent': {
templateUrl: "templates/feed.html",
controller: "FeedCtrl"
}
}
})
J'ai le lien suivant dans mon application :
<a ui-sref="app.feed({ feedId: 5 })">My Link</a>
J'essaie d'obtenir le feedId
dans les paramètres d'état :
angular.module('MyApp').controller('FeedCtrl', function($state) {
console.log($state.params);
});
Mais malheureusement, $state.params
est toujours {}
.
Qu'est-ce que je fais mal?
QUESTION BONUS
Je m'attends à FeedCtrl
à initialiser à chaque fois que je clique sur le lien, c'est-à-direchaque fois que l'état est changé en app.feed
.Donc, si je change entre app.feed
état et un autre état plusieurs fois, je m'attends à ce que le console.log
ci-dessus pour exécuter plusieurs fois.Mais il semble que l'interface utilisateur-routeur s'initialise FeedCtrl
juste une fois.Pourquoi?
La solution
Pour passer un paramètre, nous devons le définir :
.state('app.feed', {
url: "/feed/{feedId}",
views: {
'menuContent': {
templateUrl: "templates/feed.html",
controller: "FeedCtrl"
}
}
Dans ce cas, nous le définissons comme {feedId}
En voir plus ici
Quelques exemples:
'/user/{id:[^/]*}'
- Pareil que'/user/{id}'
de l'exemple précédent.'/user/{id:[0-9a-fA-F]{1,8}}'
- Similaire à l'exemple précédent, mais ne correspond que si le paramètre id est composé de 1 à 8 chiffres hexadécimaux.'/files/{path:.*}'
- Correspond à n'importe quelle URL commençant par « /files/ » et capture le reste du chemin dans le paramètre « chemin ».'/files/*path'
- Idem.Syntaxe spéciale pour fourre-tout.
Dans le cas où nous avons défini des paramètres, nous naviguerons entre les états avec différents feedId
valeurs...on verra vraiment, que ce contrôleur FeedCtrl
est réinstancié.C'est ainsi que le ui-router
a été conçu