如何检测Angular2中的路径

Question

I'm trying to make something like here: AngularJS show div based on url/condition

<span id="page-locator" *ngIf="location.path() == '/overview'">test</span>

but it doesn't work.

How can I achieve this in Angular2?

Thanks.

Answer 1

It looks like you're trying to use the path of the Angular router, correct? If so, you can inject the Router service into your component and use that in your view:

import { Router } from '@angular/router';

export class SomeComponent {
    constructor(public router: Router) { }
}

Then in your component template you can access the current router url via:

<span id="page-locator" *ngIf="router.url === '/overview'">test</span>

Answer 2

window.location is where you can get your information!

for an absolute path you can go this way :

constructor(location:Location) {
  console.log(location.prepareExternalUrl(location.path()));
}

Answer 3

Try the following solution :

location: any;
constructor(private _router: Router) { 
      _router.events.subscribe((data:any) => { this.location = data.url; });
}

The data is an object and we need the url property contained in that object.

<span id="page-locator" *ngIf="location == '/overview'">test</span>