1. ホーム
  2. アンギュラー

[解決済み】ルーターリンクでクエリパラメータを渡す方法

2022-04-02 05:02:24

質問

クエリパラメータを渡したい prop=xxx .

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

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

解決方法は?

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