Угловой : Маршрутизация к дочернему компоненту с помощью метода навигации с относительным маршрутом не работает

#angular #typescript #angular-routing

Вопрос:

Используемый пример приведен в этом стекблитце

Вот как структурирована маршрутизация

     RouterModule.forRoot([
      {
        path: 'login',
        component: LoginViewComponent,
        children: [
          { path: 'home', component: HomeViewComponent },
          { path: 'catalog/:id', component: CatalogViewComponent }
        ]
      },
      { path: '**', redirectTo: 'login' }
    ])
  ],
 

Когда я нахожусь в компоненте входа в систему, я могу перейти в компонент home по этому абсолютному маршруту

 this.navigate(['login/home']);
 

Я также могу использовать navigateByUrl() вот так

 this.navigateByUrl(['login/home']);
 

Но я не понимаю, как проложить маршрут относительно navigate()

 this.navigate(['home'], { relativeTo: this.route });
this.navigate(['/home'], { relativeTo: this.route });
 

Ни один из этих методов не маршрутизируется на домашний компонент

Ответ №1:

Вместо создания дочерних маршрутов у меня просто есть другой маршрут с тем же именем в пути:

приложение-маршрутизация.модуль.ts

 { path: "activity", component: ActivityComponent },
{ path: "activity/orders", component: OrdersComponent },
 

Если я нахожусь в activity компоненте, я перехожу к заказам по:

 this.router.navigate(["orders"], { relativeTo: this.route });`
 

импорт и конструктор в компоненте действия

 import { Router, ActivatedRoute } from "@angular/router";
constructor(
  private router: Router,
  private route: ActivatedRoute,
) {
 

Комментарии:

1. Я создал этот проект, чтобы понять, как работает относительная маршрутизация в Angular. Ваш ответ больше похож на обходной путь и не объясняет, почему он не работает в моем случае.