Paramètres pour les États sans URLs dans ui-router pour AngularJS
j'utilise ui-router pour représenter les états dans mon application AngularJS. J'aimerais y changer l'état sans changer L'URL (en gros, une "vue de détail" est mise à jour, mais cela ne devrait pas affecter L'URL).
j'utilise <a ui-sref="item.detail({id: item.id})">
pour afficher les détails mais cela ne fonctionne que si je spécifie une URL comme url: "/detail-:id"
dans mon $stateProvider
.
il me semble que l'état actuel n'est défini que par L'URL.
3 réponses
Merci pour votre réponse, ça m'a aidé dans la bonne direction, mais je voudrais juste ajouter une description plus complète.
dans ma question spécifique, il y avait un facteur de complication parce que l'État dont j'avais besoin pour injecter un paramètre non-URL était un État enfant. Qui a compliqué un peu les choses.
la params: ['id']
partie va dans la $stateProvider
déclaration comme ceci:
$stateProvider.state('parent', {
url: '/:parentParam',
templateUrl: '...',
controller: '...'
}).
state('parent.child', {
params: ['parentParam','childParam'],
templateUrl: '...',
controller: '...'
});
et le nom param est connecté à l'attribut ui-sref
comme ceci:
<a ui-sref=".child({ childParam: 'foo' })">
Et le hic, c'est ceci:
si l'état parent a aussi un paramètre URL alors l'enfant a besoin de déclarer aussi que dans son tableau
params
. Dans l'exemple ci-dessus, la "parentParam" doit être incluse dans l'état de l'enfant.
si vous ne le faites pas alors une erreur de module sera lancée lorsque l'application est initialisée. C'est au moins vrai sur la dernière version au moment de la rédaction (v. 0.2.10).
MODIFIER
@gulsahkandemir souligne que
Déclaration de paramètres dans une définition de l'état a changé à params: { id: {} } params: ['id']
a en juger par le changelog, cela semble être le cas à partir de v0.2.11
détails de params peut être trouvé dans les documents officiels
juste une information supplémentaire pour les nouveaux venus à ce poste:
Déclaration de paramètres dans une définition de l'état a changé params: { id: {} }
à partir de params: ['id']
Afin d'être au courant :)
Source: http://angular-ui.github.io/ui-router/site/#/api/ui.router.state.$stateProvider
j'ai maintenant compris, que vous devez utiliser la propriété params: ['id']
de l'État pour avoir la clé non dépouillée quand vous n'utilisez pas une URL.