Get the Current Route in Angular 15 Example
Hello Dev,
This tutorial will provide an example of angular 15 get current route. This article will give you a simple example of angular 15 get current route path. I would like to share with you angular 15 get current route. you will learn how to get current route in angular 15.
we will use the angular Router library to get the current route in the component file. we can easily get the current route path with Router.
We might be some time need to get the current path or current router URL in the angular application. so if you need it now then I will help you how you can get the current URL in angular. so you can see the basic solution below:
You can get the current route name like as below, i also wrote 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...
Hardik Savani
I'm a full-stack developer, entrepreneur and owner of ItSolutionstuff.com. I live in India and I love to write tutorials and tips that can help to other artisan. I am a big fan of PHP, Laravel, Angular, Vue, Node, Javascript, JQuery, Codeigniter and Bootstrap from the early stage. I believe in Hardworking and Consistency.
We are Recommending you
- Angular 15 Install Font Awesome Icons Example
- Angular 15 CRUD Application Tutorial Example
- How to Integrate Google Maps In Angular 15 App?
- Angular 15 Stripe Payment Integration Example
- Angular 15 Google Social Login Tutorial Example
- Angular 15 HttpClient & Http Services Tutorial
- Angular 15 Pagination with NGX Pagination Example
- Angular 15 RxJS Observable with Httpclient Example
- How to Setup Routing & Navigation in Angular 15?
- Angular 15 Service Tutorial with Example
- Angular 15 Template Driven Form Validation Example
- Angular 15 Multiple File Upload Example Tutorial
- Angular 15 Multiple Image Upload with Preview Example
- How to Add Material Theme in Angular 15?
- Create Your First Angular 15 Step by Step Example