Search code examples
angularangular4-router

$locationChangeStart equivalent in Angular 4


What is the $locationChangeStart equivalent in Angular 4? I am looking for a handler to track the url changes. I read that there is a location service but I am not sure if I need to use this or look for something here https://angular.io/guide/router.. Any pointers would be really helpful. Thanks!

Update: I want to do this inside a service not a component.


Solution

  • In Angular there are router events that you can subscribe to:

    What you want is the NavigationStart event.

    Angular Docs NavigationStart

    Here is a nice code example provided as an answer on this StackOverflow question on how to use it properly.

    import { Router, ActivatedRoute, NavigationStart } from '@angular/router'; 
    
    export class AppComponent { 
       constructor(public _router: Router, private _activeRoute: ActivatedRoute,    private _location: Location) {
         this.router = _router; 
         this.router.events
             .filter(e => e instanceof   NavigationStart)     
             .pairwise()
             .subscribe((e) => { alert(e); }); 
       }
    }