CODEWITHSUNDEEP
javascriptangularangular2-routing
Huy Pham
Huy Pham

Reputation: 163

How to detect URL change in angular 2?

Route change can be detected using the router.events stream. (How to detect a route change in Angular 2?).

But I am not sure how to detect browser URL change.

Upvotes: 10

Views: 16971

Answers (3)

David
David

Reputation: 2251

Inject Location and use the onUrlChange event listener:

import { Location } from '@angular/common';

constructor(private location: Location) {
  location.onUrlChange(url => console.log(url));
}

Upvotes: 4

Mohammed Aamier
Mohammed Aamier

Reputation: 188

You can achieve to subscribe to router events from your root file like this

constructor(private router: Router,
          private aRouter: ActivatedRoute) {
this.router.events.pipe(filter(e => e instanceof NavigationEnd))
.subscribe((s: NavigationEnd) => {
  //write your logic here
   console.log(s);
});
}

Upvotes: 2

Günter Zöchbauer
Günter Zöchbauer

Reputation: 658067

You can inject Location and subscribe to it

import { Location } from '@angular/common';

...

constructor(location:Location) {
  location.subscribe(val => console.log(val));
}

As Harry mentioned. This only notifies about popState events (the router or similar code changing the URL)

Upvotes: 3

Related Questions