Comment passer des paramètres de requête avec un routerLink

Je veux passer un paramètre de requête prop=xxx.

Cela n'a pas fonctionné

<a [routerLink]="['/somepath', {queryParams: {prop: 'xxx'}}]>Somewhere</a>
  • La syntaxe que vous souhaitez utiliser est pour les paramètres de matrice et c'est la forme <a [routerLink]="['/somepath', { foo: 'foo' }]">Somewhere</a>, cela vous donne une matrice des paramètres d'url (point-virgule ; au lieu de ? et & séparateurs) et vous pouvez y accéder en ActivatedRoute.params au lieu activatedRoute.queryParams Plus d'informations ici stackoverflow.com/questions/35688084/... et voilà stackoverflow.com/questions/2048121/...
  • Les paramètres de la requête et de la matrice de paramètres sont les mêmes. La seule différence, c'est quand ils sont ajoutés à la racine du segment, ils sont sérialisés en tant que paramètres de la requête, lorsqu'ils sont ajoutés à un enfant segment, ils sont sérialisés en tant que paramètres de matrice.
  • Quelques différences cochez cette web.archive.org/web/20130126100355/http://brettdargan.com/blog/... Aussi, vous pouvez consulter le lien de la syntaxe des paramètres dans l'angle de doc ici angulaire.io/docs/ts/latest/guide/...
InformationsquelleAutor Günter Zöchbauer | 2016-06-17
  1. 250

    queryParams

    queryParams est une autre entrée de routerLink où ils peuvent être passés comme

    <a [routerLink]="['../']" [queryParams]="{prop: 'xxx'}">Somewhere</a>

    fragment

    <a [routerLink]="['../']" [queryParams]="{prop: 'xxx'}" [fragment]="yyy">Somewhere</a>

    routerLinkActiveOptions

    Également d'obtenir des itinéraires active de la classe et des parents routes:

    [routerLinkActiveOptions]="{ exact: false }"

    Pour passer les paramètres de requête pour this.router.navigate(...) utilisation

    let navigationExtras: NavigationExtras = {
  queryParams: { 'session_id': sessionId },
  fragment: 'anchor'
};

//Navigate to the login page with extras
this.router.navigate(['/login'], navigationExtras);

    Voir aussi https://angular.io/guide/router#query-parameters-and-fragments

    • Comment serait-ce de travailler par programmation? J'ai essayé avec cette.routeur.naviguer( ['/resetPassword', { queryParams: { nom d'utilisateur: identifiant de connexion }}]); Mais le résultat était: localhost:8100/resetPassword;queryParams=%5Bobject%20Object%5D
    • J'ai mis à jour ma réponse. Voir aussi le lien que j'ai ajouté. Il montre un exemple complet.
    • Quelques remarques: rickul du code doit être [ '/resetPassword' ], { queryParams: { username: loginName }}) où la ] vient avant les extras. Aussi, ne pas oublier que la requête de paramètres sont sensibles à la casse.
    • N'oubliez pas de vous abonner à la queryParams sur la cible: stackoverflow.com/a/39146396/2726844
    • Ou si vous êtes à utiliser les routes, runGuardsAndResolvers: 'always' recharger la route medium.com/engineering-on-the-incline/...
    InformationsquelleAutor Günter Zöchbauer