Wie bekomme ich Routenparameter in angular2 RC5

Question

Ich habe mein angular2 Projekt auf RC5 mit angular-cli@webpack aktualisiert.

Ich biete haben Routing wie folgt:

const appRoutes: Routes = [ 
    { path: 'project-manager', component: ProjectManagerComponent }, 
    { path: 'designer/:id', component:DesignerComponent } , 
    {path: '',redirectTo: '/project-manager',pathMatch: 'full'} 
]; 

und ich Designer Component bin Umleitung mit Router als:

<a [routerLink]="['/designer',page._id]"><i class="fa fa-eye fa-fw"></i></a> 

Jetzt erfolgreich immer Es wird umgeleitet, und ich bin in der Lage param Wert zu sehen in der Adressleiste des Browsers.

Jetzt möchte ich wissen, wie kann ich auf diesen Parameter in DesignerComponent in angular2 RC5 zugreifen.

Answer 1

Ich glaube, Sie brauchen die ActivatedRoute vom Router zu benutzen, um Ihre zu manipulieren Parameter.

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

... 

constructor(private route: ActivatedRoute, ...) { 
} 

value: any; // -> wanted parameter (use your object type) 

ngOnInit() { 
    // get URL parameters 
    this.route.params.subscribe(params => { 
     this.value = params['id']; // --> Name must match wanted parameter 
    }); 
} 

Vergessen Sie nicht OnInit von @angular/core zu importieren, wenn Sie es auch benötigen.

---

EDITED:

• Cleanup Abonnement zu vermeiden, weil die NG2-Router seine Abonnements auf seinem eigenen verwaltet.
• Vermeiden Sie die Verwendung von privaten Variablen, die möglicherweise in HTML verwendet werden, um zu vermeiden, dass die AOT-Kompilierung unterbrochen wird.
• Gereinigt ROUTER_DIRECTIVES, weil es veraltet ist.

Answer 2

Erster Import ActivatedRoute von @angular/router.

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

Zugriff es Konstruktor wie folgt:

constructor(private route: ActivatedRoute){    
} 

abonnieren Wechsel innerhalb ngOnInit params wie folgt:

ngOnInit() { 
    this.route.params.subscribe(params => { 
    if (params['id']) { 
    } 
    }); 
}