title: NavigationStart not getting called for angular
body: <p>I am trying to track url changes using navigationStart event of angular. I am writing a feature module and this url tracking needs to be done in a service and not a component. I don't even have a component. In this url tracking handler, I also want to find out the hash fragment of url. I tried below code but navigationStart never gets fired. If I have to map it to angularjs then this is how we used to do it.</p>
  
  <p><strong>angularjs code</strong>  </p>
  
  <pre><code>  $rootScope.$on('$locationChangeStart', locationChangeHandler);
  
    var locationChangeHandler = function (event, newUrl, oldUrl) {
  }
  </code></pre>
  
  <p><strong>angular Code</strong></p>
  
  <pre><code>export class MyGuard implements CanActivate {
  
    constructor(  private router: Router , private activatedRoute: ActivatedRoute) {
  
      this.activatedRoute.fragment.subscribe((fragment: string) =&gt; {
        console.log("My hash fragment is here =&gt; ", fragment)
      })
  
      this.router.events
        .filter(e =&gt; e instanceof   NavigationStart)
        .pairwise()
        .subscribe((e) =&gt; {
          console.log("inside navigation start");
          console.log(e) })
  
  
  
      this.router.events.subscribe(event =&gt; {
  
     // This didn't work
     //if(event instanceof NavigationStart) {
       //   console.log("navigation started");
       // }
  
        else if(event instanceof NavigationEnd) {
          console.log("navigation ended");
        }
  
  
        else if(event instanceof NavigationCancel) {
          console.log("navigation cancelled");
        }
  
        else if(event instanceof NavigationError) {
          console.log("navigation errored");
        }
  
  
        else if(event instanceof RoutesRecognized) {
          console.log("navigation routes recognized");
        }
  
      })
  
  
    }
  </code></pre>