web-dev-qa-db-ja.com

新しいRouter V 3 alpha（vladivostok）のrouterLinkでクエリパラメーターを渡す方法

クエリパラメータprop=xxxを渡します。

これはうまくいきませんでした

<a [routerLink]="['/somepath', {queryParams: {prop: 'xxx'}}]>Somewhere</a>
angularangular2-routing
90
Günter Zöchbauer

queryParams

queryParamsはrouterLinkの別の入力であり、次のように渡すことができます

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

fragment

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

routerLinkActiveOptions

親ルートに設定されたルートのアクティブクラスも取得するには：

[routerLinkActiveOptions]="{ exact: false }"

クエリパラメータをthis.router.navigate(...)に渡すには

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

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

https://angular.io/guide/router#query-parameters-and-fragments も参照してください

192
Günter Zöchbauer