こんにちは、コーテッグのこやまです。
Angularでapp.componentや、そのほか必要なときに、route-outletの外から現在のurlを取得したい場合のコードです。
import { Router, ActivatedRoute, NavigationEnd } from '@angular/router'; ~~ constructor( private router: Router ) {} ngOnInit() { this.router.events .pipe(filter(e => e instanceof NavigationEnd)) .subscribe((e: NavigationEnd) => { console.log(e.url) // 現在のパスを出力 }); }
最初は何も考えずにActivatedRouteを使おうとしていましたが、
ドキュメントに以下のようにあるので、使いません。
“Contains the information about a route associated with a component loaded in an outlet.”
https://angular.jp/api/router/ActivatedRoute
router.eventsは16個あったので、filterしないといっぱい出力されてしまします。
1つでいいので、”An event triggered when navigation ends successfully.”のNavigationEndにします。
https://angular.io/guide/router
これで取れます。
私はヘッダーを共通で使って、特定のurlのときに表示を変更するというのに使いました。