Angular - передать дополнительные параметры следующему компоненту маршрута

Question

Я хотел бы знать, как передавать дополнительные параметры на следующую страницу вместо использования: только идентификатор.

Текущий рабочий код

Исходная страница (электронная почта-шаблон)

addEmailTemplate(){
    this.router.navigate(['email-template','new','email-template-details']);

  }

Целевая страница:

 this.route.params.forEach((urlParameters) => {
   this.emailId = urlParameters['id'];
 });

Определенный маршрут:

const routes: Routes = [
  {
    path: '',
    component: EmailTemplateComponent,
    data: {
      title: 'Email Template'
    }
  },
  {
    path: ':id/email-template-details',
    component: EmailTemplateDetailsComponent,
    children: [
      { path: '', redirectTo: 'email-template', pathMatch: 'full'},
      { path: '', component: EmailTemplateDetailsComponent, data: {title: 'Email Template Details'}}
    ]
  },
];

Импортированный маршрутизатор:

import { Router, ActivatedRoute, ParamMap } from '@angular/router';

То, чего я хочу достичь

Исходная страница (шаблон электронной почты), этот код не работает:

addEmailTemplate(){
    this.router.navigate([
       'email-template',
       {id:'new',type:'newType'},
       'email-template-details'
    ]);
  }

Целевая страница (подробности шаблона электронной почты):

I don know how to catch the "type" and "id". Expected to get "newType" from Origin Page

Answer 1

Звучит как хороший вариант использования для локального хранения.

addEmailTemplate(){
    localStorage.setItem('myData', JSON.stringify({id:'new',type:'newType'})
    this.router.navigate([yourUrl]);
}

Затем на странице, которую вы перенаправили на:

getData() {
  return localStorage.getItem(JSON.parse('myData'));
}

Answer 2

Вы можете использовать разрешение маршрута .

разрешение маршрута