Angular 8 необязательных параметров URL

Question

import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';

import { LayoutComponent } from './layouts/layout.component';

const routes: Routes = [
  {
    path: '',
    component: LayoutComponent,
    children: [
      {
        path: ':id',
        loadChildren: './layouts/layout.module#LayoutModule'
      }
    ]
  },
  {      /* THIS BELOW BLOCK WORKS */
    path: '',
    component: LayoutComponent,
    children: [
      {
        path: '',
        loadChildren: './layouts/layout.module#LayoutModule'
      }
    ]
  }
];

@NgModule({
  imports: [RouterModule.forRoot(routes, {
    scrollPositionRestoration: 'enabled'
  })],
  exports: [RouterModule]
})
export class AppRoutingModule { }

Я пытаюсь получить 2 разных набора URL с одинаковым набором макетов. поэтому мой первый URL будет выглядеть как http://localhost: 4200 / account - это прекрасно работает http://localhost: 4200/20 / account - это мой 2-й URL, и это не так работа и сообщение об ошибке

core.js:5882 ERROR Error: Uncaught (in promise): Error: Cannot match any routes. URL Segment: '20/account'

Я не уверен, где я ошибся, кто-нибудь может помочь это?

Answer 1

вы можете удалить путь: ': id' и получить в подрядчике параметры:

  public constructor(
        private route: ActivatedRoute,
        private router: Router,
        injector: Injector
    ) {
        super(injector);
        this.route.params.subscribe((p) => {
            this.stateIdFilter = [Number.parseInt(p.id)];
            if (p.id) {
               this.getData();
            }
        });      }