angular2 - Route zur Komponente basierend auf externem Abfrageparameter

Question

Wie kann ich meinen Router so konfigurieren, dass er die Umleitung basierend auf einer Abfragezeichenfolge unterstützt? betrachten Sie das folgende Szenario: die App sendet eine E-Mail mit Code-Validierung, ich möchte der Benutzer auf die E-Mail klicken und zu bestimmten Komponente gehen. (z. B. http://some.site.com/activate?code=XXX) sollte zu ActivateComponent und dem Code als Eingabe gehen.

Wie kann ich das erreichen?

Answer 1

Sie können unter Versuchen,

Route, 
{ path: 'activate', component: ActivateComponent } 

@Component({ 
    selector: 'activate', 
    template: ` 
    <h1>{{code | async}}</h1> 
    ` 
    }) 
export class ActivateComponent { 
    code = ""; 
constructor(private router: Router) {} 

ngOnInit() { 
    // Capture the code if available 
    this.code = this.router 
    .routerState 
    .queryParams 
    .map(params => params['code'] || 'None'); 
    } 
} 

und wo immer Sie diesen Weg gehen wollen, können Sie eine ähnliche Funktion wie unten haben,

gotoLink =() =>{ 
    let navigationExtras = { 
     queryParams: { 'code': 'XXX' } 
    }; 

    this.router.navigate(['/activate'], navigationExtras); 
    } 

Hier ist die Plunker!!

Hoffe das hilft !!