Retrieve hash fragment from url with Angular2

typescript angular2-routing
MFB picture MFB · Apr 16, 2016 · Viewed 29.8k times · Source

Given this url structure (over which I have no control), how can I retrieve the hash fragment using Angular2?

http://your-redirect-uri#access_token=ACCESS-TOKEN

My router does route to the correct component, but everything after oauth get scrapped and I can't find the hash fragment in request.params or location.path. Doomed??

Router config:

@RouteConfig([
{path: '/welcome', name: 'Welcome', component: WelcomeComponent, useAsDefault: true},
{path: '/landing/oauth', name: 'Landing', component: LandingComponent}  // this one

])

Answer

Ismail H picture Ismail H · Feb 2, 2017

For those still looking :

import { ActivatedRoute } from '@angular/router';

export class MyComponent {

  constructor(
    private route: ActivatedRoute,
  ) { }

  myfunction(){
    this.route.fragment.subscribe((fragment: string) => {
        console.log("My hash fragment is here => ", fragment)
    })
  }
}

Related questions

Angular 2 - How to navigate to another route using this.router.parent.navigate('/about')?

Angular 2 - How to navigate to another route using this.router.parent.navigate('/about'). It doesnt seem to work. I tried location.go("/about"); as that didnt work. Basically once a user has logged in I want to redirect …

Read More
In Angular, how do you determine the active route?

NOTE: There are many different answers here, and most have been valid at one time or another. The fact is that what works has changed a number of times as the Angular team has changed its Router. The Router 3.0 version …

Read More
Angular redirect to login page

I come from the Asp.Net MVC world where users trying to access a page they are not authorized are automatically redirected to the login page. I am trying to reproduce this behavior on Angular. I came accross the @CanActivate …

Read More