web-dev-qa-db-ja.com

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

_{ provide: LocationStrategy, useClass: HashLocationStrategy },_で_app.module.ts_を使用しています。しかし、_this.route.url_を指定すると、_/_であるか_/home_であるか_/dashboard_であるかにかかわらず、常に_/profile_が含まれます

特定のルート値を取得する必要があります

constructor(public router:Router) {} alert(this.router.url);

angulartypescriptangular-routing
5
Krishna

routeインスタンスはRouterからのものである必要があります

constructor(
    private router: Router
  ) { }

this.router.url // this must contains your full router path
9
Pardeep Jain

これがv5に適用されるかどうかは不明ですが、とにかく役立つ場合があります

ルーターイベントNavigationEndをサブスクライブすることもできます。これは、常に現在のURLを取得するための最良の方法のようです。

重要な注意：
-常に最後のURL値を取得するために、このコードを_app.component.ts_ファイルのcontructor()に配置してください。

_
// file: src/app/app-component

  export class AppComponent {
  constructor(private router: Router) {

    // listen to events from Router
    this.router.events.subscribe(event => {
      if(event instanceof NavigationEnd) {
        // event is an instance of NavigationEnd, get url!  
        const url = event.urlAfterRedirects;
        console.log('url is', url);
      }
    })

  }
}
_
5
guillefd

ハッシュをURLの一部にしたくない場合は、以下のコードに示すようにハッシュfalseを使用してください。

  RouterModule.forRoot([
  {path: 'welcome', component: WelcomeComponent},
  {path: '', redirectTo: 'welcome', pathMatch: 'full'},
  {path: '**', component: PageNotFoundComponent},
], {useHash: false}),
ProductModule,

それが役に立てば幸い

0
debugmode