How to catch routes in *ngIf

mycomponent.component.ts

import { Router } from '@angular/router'

class MyComponent {
    constructor(public router: Router) { }
}

mycomponent.component.html

<div *ngIf="router.url === '/some/route'">
    <!-- … -->
</div>

I came to this page because I had the same issue than Ravy but the proposed solutions were not ok for me.

The accepted answer is not working if you are using route path with query params.

Here's the solution I use:

mycomponent.component.ts

import { Router } from '@angular/router'

class MyComponent {
    constructor(public router: Router) { }
}

mycomponent.component.html

<div *ngIf="router.isActive('/some/route')">
    <!-- … -->
</div>

Related