Angular Get Active Route URL Example

Today, i will let you know how to get active route in angular application. we will see example of angular get active route name and url. we can easily get active route url in component angular.

Wr can easily get current active route in angular 6, angular 7, angular 8, angular 9, angular 10, angular 11, angular 12, angular 13, angular 14, angular 15, angular 16 and angular 17 application.

we will use angular Router library to getting active route in component file. we can easily get active route path with Router.

We might be some time need to get active path or active router url in angular application. so if you need now then i will help you how you can get active url in angular. so you can see basic solution bellow:

You can get active route name like as bellow, i also written full example with output so, you can understand:

this.router.url;
  
window.location.href;

Now i will give you full example. you can write code on your component file as like bellow:

Component File

import { Component, OnInit } from '@angular/core';
import { Router } from '@angular/router';
   
@Component({
  selector: 'app-posts',
  templateUrl: './posts.component.html',
  styleUrls: ['./posts.component.css']
})
export class PostsComponent implements OnInit {
  
  constructor(private router: Router) { }
  
  ngOnInit() {
    console.log(this.router.url);
    console.log( window.location.href);
  }
  
}

You can see output also.

Output:

/posts
http://localhost:4200/posts

I hope it can help you...