Remplacez génériquement le paramètre de route Angular 2 et naviguez

Question

Je crée une application Angular dans laquelle la plupart des routes se rapportent à un projet donné et contiennent un ID de projet. Dans la zone de navigation supérieure se trouvera une liste déroulante de projets. Lorsque l'utilisateur sélectionne un projet dans la liste déroulante, il doit naviguer vers l'itinéraire actuel, mais avec le projectId remplacé par la nouvelle valeur.

Ceci est très similaire à Angular navigate to url by replacing an existing parameter, cependant leur réponse acceptée a utilisé des paramètres de requête; Cela doit fonctionner sur les paramètres de route requis. Le projectId peut également apparaître dans différentes positions au sein de l'itinéraire, de sorte que cela doit génériquement être capable d'échanger un paramètre de route par son nom.

donc hypothétiquement je pourrais avoir les routes suivantes:

project/:projectId/details 
dashboard/status/:projectId/:year/:month/:day 
admin/projects/:projectId 
admin/contacts/:projectId/settings 
admin/generalSettings 

Ces itinéraires sont fictifs, mais démontrent que le projectId peut apparaître dans diverses positions et ne seront pas précédés d'un mot spécifique (je ne peux pas, par exemple chercher un segment nommé "projet" puis saisissez le segment suivant).

Conceptuellement, je voudrais

• Prenez du routeur la route actuelle et des cartes de l'itinéraire params (comme paramMap), paramètres de requête, et la matrice params
• Modifiez les valeurs dans les cartes si nécessaire, à savoir si le paramMap contient "projectId" puis le mettre à jour.
• Remettez la route et les cartes au routeur pour y naviguer.

Il semble donc conceptuellement simple, mais quand je regarde routerState et son arbre de routes du routeur (que je ne comprends pas tout à fait) et la méthode Router.navigate, je ne vois pas comment atteindre cet objectif . Je n'ai pas de problème avec l'arbre de route pour reconstruire l'itinéraire, tant que 1) cela peut être fait de manière générique sans aucune connaissance de la structure de route de l'application, et 2) l'itinéraire résultant est identique à l'itinéraire original (y compris les paramètres de requête et de matrice) autre que la modification du paramètre de route ciblée (projectId).

Answer 1

Qu'en est-ce:

J'ai le ActivatedRoute et le routeur injecté dans mon service/composant:

constructor(
    private route: ActivatedRoute, 
    private router: Router) {} 

Ensuite, je fait une méthode pour changer le paramètre de la matrice de routage. Les paramètres sont le nom du paramètre de matrice à remplacer et la nouvelle valeur. Je n'ai trouvé aucun autre moyen de rechercher le paramètre pour remplacer autre que la comparaison des segments de trajectoire avec les paramètres de la route activée.

changeParam(replaceParamName: string, val: any) { 
    let replacePathParamIndex; 
    let replacePathParamValue; 
    this.route.params 
     .map((params) => replacePathParamValue = params[replaceParamName]) 
     .mergeMap(() => this.route.url) 
     .map((urlSegment) => 
      urlSegment.map((segment, ndx) => { 
       if (segment.path === replacePathParamValue) { 
        replacePathParamIndex = ndx; 
       } 
       return segment.path; 
      }) 
     ) 
     .subscribe((pathparts: any[]) => { 
      pathparts[replacePathParamIndex] = val; 
      this.router.navigate(pathparts); 
    }); 
} 

Enfin démarrer la navigation remplacé en appelant:

changeParam('projectId','newprojectid');