Как настроить динамическую на лету угловую маршрутизацию?

Question

Я попытался создать маршруты на лету следующими двумя способами внутри ngOnInit корневого компонента app.component.ts

this.router.resetConfig([
  { path: 'news/:article-slug', component: ArticleComponent },
  { path: 'pages/:page', component: StaticPagesComponent },
  ...this.router.config
]);

И

this.route.config.unshift(
  { path: 'news/:article-slug', component: ArticleComponent },
  { path: 'pages/:page', component: StaticPagesComponent }
);

Но ни тот, ни другой методработать, когда я набираю URL в браузере. Они работают только в том случае, если URL-адреса создаются с помощью routerLink, и я нажимаю на них.

Как создать динамические маршруты, к которым можно получить доступ, введя URL-адрес в браузере?

Answer 1

Вместо того, чтобы поместить свой код ngOnInit, вы должны поместить его в конструктор app.component.

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {

  constructor(private router: Router) {
    this.router.config.unshift(
      { path: 'page1', component: Page1Component },
      { path: 'page2', component: Page2Component }
    );
  }
}

С уважением