How to redirect to angular 6 page when user click

2019-08-05 06:53发布

问题:

How to redirect to angular 6 page when the user clicks on account activation in the email.

My process flow:
1. User register account.
2. The user gets activation account link from the email. Link example: http://localhost/editProfile/{userId} /token/{token}. This should be my API which gets JWT token from backend.
3. User click on the link and user will redirect to edit profile page.

My problem is I do not understand by using angular 6 when user redirects to edit profile page how I can get the token and id from the URL when the user clicks the URL.

回答1:

You can achieve it with something like below (Those are not being tested, sorry if i have made any typos / mistakes, let me know.). Simple route parameters handling.

In your route definitions:

export const routes: Routes = [
  { path: '/editProfile/:userId/token/:token', component: MyComponent }
]

In your route component:

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

export class EditProfileComponent implements OnInit, OnDestroy {
  userId: string;
  token: string;

  private subscription: Subscription ;

  constructor(private route: ActivatedRoute) { }

  ngOnInit() {
    this.subscription = this.route.params.subscribe(params => {
      this.userId = params['userId'];
      this.token = params['token'];
    });
  }

  ngOnDestroy() {
    this.subscription.unsubscribe();
  }
}

See https://angular-2-training-book.rangle.io/v/v2.3/handout/routing/routeparams.html for more about route parameters.