How to detect a route change in Angular?

0 votes
I am looking to detect a route change in my AppComponent.

Thereafter I will check the global user token to see if he is logged in. Then I can redirect the user if he is not logged in.
Apr 22 in Angular by kartik
• 11,290 points
298 views

1 answer to this question.

0 votes

Hii Kartik

For Angular 7 someone should write like:

this.router.events.subscribe((event: Event) => {})

A detailed example can be as follows:

import { Component } from '@angular/core'; 
import { Router, Event, NavigationStart, NavigationEnd, NavigationError } from '@angular/router';

@Component({
    selector: 'app-root',
    template: `<router-outlet></router-outlet>`
})
export class AppComponent {

    constructor(private router: Router) {

        this.router.events.subscribe((event: Event) => {
            if (event instanceof NavigationStart) {
                // Show loading indicator
            }

            if (event instanceof NavigationEnd) {
                // Hide loading indicator
            }

            if (event instanceof NavigationError) {
                // Hide loading indicator

                // Present error to user
                console.log(event.error);
            }
        });

   }
}
answered Apr 22 by Niroj
• 22,790 points

Related Questions In Angular

0 votes
1 answer

How can we redirect to an existing route using ngRoute?

Routing is just another way of fixing some content ...READ MORE

answered Feb 6 in Angular by Niroj
• 22,790 points
95 views
0 votes
1 answer

How to perform Email Validation in Javascript?

Validation is a method to authenticate the ...READ MORE

answered Feb 6 in Angular by Niroj
• 22,790 points
31 views
0 votes
1 answer

How can we specify no route path in UI-Router?

hey @kartik, In order to route to any ...READ MORE

answered Feb 11 in Angular by anonymous
• 22,790 points
34 views
0 votes
1 answer

How compile, controller, pre-linking and post linking works in Angularjs?

Explanation of compile and link process don't ...READ MORE

answered Jan 31 in Angular by Niroj
• 22,790 points
61 views
0 votes
1 answer

What is meant by passing the variable by value and reference in PHP?

Hello, When the variable is passed as value ...READ MORE

answered Mar 27 in PHP by Niroj
• 22,790 points
36 views
0 votes
1 answer

Connection with MySQL server using PHP. How can we do that?

Hey @kartik, You have to provide MySQL hostname, ...READ MORE

answered Mar 27 in PHP by Niroj
• 22,790 points
41 views
0 votes
1 answer

How to retrieve or obtain data from the MySQL database using PHP?

Hello kartik,  Actually there are many functions that  ...READ MORE

answered Mar 27 in PHP by Niroj
• 22,790 points
33 views
0 votes
1 answer

What are the differences between mysqli_connect and mysqli_pconnect?

Hello, mysqli_pconnect() function is used for making a persistence ...READ MORE

answered Mar 27 in PHP by Niroj
• 22,790 points
71 views
0 votes
1 answer

How to pass a string parameter from angular UI to node.js backend?

Hello Kartik, There are three ways to get ...READ MORE

answered Apr 22 in Angular by Niroj
• 22,790 points
95 views
0 votes
1 answer

How to load external scripts dynamically in Angular?

Hello kartik, You can use following technique to ...READ MORE

answered Apr 22 in Angular by Niroj
• 22,790 points
492 views