web-dev-qa-db-fra.com

Ajout d'un paramètre à Angular router.navigate

Tout d'abord, je ne suis pas sûr que ce soit la bonne façon de réaliser ce que je veux .. J'essaie d'ajouter une liaison d'exportation comme la suivante à une méthode router.navigate () -:

<call [caller]="caller"></call>

Le problème est que je n'utilise jamais la directive, mais plutôt l'adresser via un routeur:

acceptCall() {
   this.router.navigate(["call"]);
}

Comment puis-je obtenir la même liaison d'exportation à partir du premier exemple de la méthode acceptCall () -? J'ai déjà ajouté une variable Input () et l'ai essayée avec queryParams comme ceci:

@Input() caller: Caller;
acceptCall(caller) {
    this.router.navigate(["call"], {queryParams: caller});
}

Mais cela ne fonctionne pas.

angulartypescriptbindingrouter
10
reveN

Suite à mes commentaires, vous devez:

1 - Redéfinissez votre itinéraire

{path: 'call/:caller', component: MyComponent }

2 - Modifiez votre navigation dans le composant parent

this.router.navigate(["call", caller]);

3 - Dans le composant enfant, récupérez le param

import { ActivatedRoute } from '@angular/router';
// code until ...
myParam: string;
constructor(private route: ActivatedRoute) {}
// code until ...
ngOnInit() {
    this.route.params.subscribe((params: Params) => this.myParam = params['caller']);
}
16
user4676340