5

Maybe I am missing something?

In an Angular 2 component, I am simply trying to get the full Activated Route.

I do not want to use location.href.

My constructor is as follows:

constructor(private route: ActivatedRoute) {} 

And in ngOnInit() I tried finding the value here to no avail:

this.route.data.url 
3
  • this.route.url. Commented Jun 30, 2017 at 19:29
  • so i would assume i have to parse the array and re-construct the url with this? I was hoping the URL existed as a string in the router data somewhere. Commented Jun 30, 2017 at 19:31
  • @MikeSomeone check my answer below, hope it helps :) Commented Jun 30, 2017 at 19:38

2 Answers 2

8

You don't need to use ActivatedRoute for that, you need to use Router to query for the current URL in the form of string:

constructor(r: Router) { console.log(r.url); } 
Sign up to request clarification or add additional context in comments.

5 Comments

THANK YOU, both this and Hamed's answers work. Is there a best practice here?
@MikeSomeone, I would argue for my approach of course as this is standard public API for the router
agreed, and it does not require calling the path() method.
From inside app.component this did not work for me: it always returned '/' (although when i logged r by itself and inspected the properties the correct url was in there). Hamed's solution works for me.
@AleshHoudek, where did you log it? Inside the App Component constructor?
4

a simpler solution is to use LocationStrategy class from the @angular/common for representing and reading route state directly from the browser's URL which is more convenient then this.router.url when trying to get the router URL in form of a string.

 import {LocationStrategy} from '@angular/common'; export class MyComponent implements OnInit { constructor(private url:LocationStrategy) { } ngOnInit() { //this will log the current url console.log(this.url.path()); } } 

6 Comments

THANK YOU, both this and Maximus's answers work. Is there a best practice here?
glad this helped! but I don't think there is a best practice in here but there are options and here is another one: you can inject RouterStateSnapshot from @angular/router constructor(state: RouterStateSnapshot) and use it like this let url: string = state.url; and by the way this method is used in the official documentation router guide.
@HamedBaatour, this will show only one url segment, same as activated route
yes that's right and I am genuinely by no means trying to argue or something (1+ on your answer) but I am just trying to give all the available options and to help as much as I can without expecting nothing in return because of my cultural and religious motives which tell me to do so.
i feel like @Maximus has the best approach. While using LocationStrategy works, it requires calling the .path() method whereas Maximus's does not.
|

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.