Angularで現在のルートを取得する方法

1. ActivatedRouteを使用する方法: AngularのRouterモジュールには、現在のルート情報を提供するActivatedRouteというクラスがあります。このクラスを使用すると、現在のルートのパスやパラメータなどの情報を取得できます。

以下は、ActivatedRouteを使用して現在のルートを取得する方法の例です。

import { ActivatedRoute } from '@angular/router';
import { Component } from '@angular/core';
@Component({
  selector: 'app-your-component',
  template: `
    <p>現在のルート: {{ currentRoute }}</p>
  `,
})
export class YourComponent {
  currentRoute: string;
  constructor(private route: ActivatedRoute) {
    this.currentRoute = this.route.snapshot.routeConfig.path;
  }
}

上記の例では、ActivatedRouteをインポートし、route.snapshot.routeConfig.pathプロパティを使用して現在のルートのパスを取得しています。このパスは、現在のコンポーネントが表示されているルートのパスを表します。

2. Routerを使用する方法: もう一つの方法は、AngularのRouterを使用して現在のルートを取得することです。Routerのurlプロパティを使用すると、現在のルートのURLを取得できます。

以下は、Routerを使用して現在のルートを取得する方法の例です。

import { Router } from '@angular/router';
import { Component } from '@angular/core';
@Component({
  selector: 'app-your-component',
  template: `
    <p>現在のルート: {{ currentRoute }}</p>
  `,
})
export class YourComponent {
  currentRoute: string;
  constructor(private router: Router) {
    this.currentRoute = this.router.url;
  }
}

上記の例では、Routerをインポートし、router.urlプロパティを使用して現在のルートのURLを取得しています。

これらの方法を使用すると、Angularで現在のルートを簡単に取得できます。適切な方法を選択して、アプリケーションの要件に合わせて使用してください。