Как перейти к дочернему маршруту по умолчанию - Angular 7 (Routes)

Question

Я использую угловые маршруты, для навигации по компонентам. Когда пользователь входит в систему, он переходит на dashboard/:id, а затем видит dashboard/123/projects и т. Д. Проблема в том, что когда пользователь переходит только на /dashboard, я хочу перенаправить его на /dashboard/:id по умолчанию. Но когда я делаю это следующим образом: { path:"dashboard", redirectTo:"dashboard/:id/projects", pathMatch:"full"} это из-за сообщения о том, что :id не определено, и я не могу перейти от /dashboard к текущему пользователю, вошедшему в систему /dashboard/123/projects.

Мой код Routes.modules.ts

const routes: Routes = [{
    path: "",
    redirectTo: "/login",
    pathMatch: "full"
  },
  {
    path: "login",
    component: LoginComponent
  },
  {
    path: "register",
    component: RegisterComponent
  },
  //the problem goes here
  {
    path: "dashboard",
    redirectTo: "", //How to redirect to dashboard/:id ?
    pathMatch: "full"
  },
  {
    path: "dashboard/:id",
    component: DashboardComponent,
    children: [{
        path: "",
        redirectTo: "projects",
        pathMatch: "full"
      },
      {
        path: "projects",
        component: ProjectsComponent
      },
      {
        path: "archived",
        component: ArchivedProjectsComponent
      },
      {
        path: "projects/:id",
        component: SingleProjectComponent,
        children: [{
            path: "",
            redirectTo: "plans",
            pathMatch: "full"
          },
          {
            path: "plans",
            component: PlansComponent
          },
          {
            path: "tasks",
            component: TasksComponent
          },
          {
            path: "photos",
            component: PhotosComponent
          },
          {
            path: "files",
            component: FilesComponent
          },
          {
            path: "people",
            component: PeopleComponent
          },
          {
            path: "settings",
            component: SettingsComponent
          },
          {
            path: "trash",
            component: TrashComponent
          },
          {
            path: "**",
            redirectTo: "plans",
            pathMatch: "full"
          }
        ]
      },
      {
        path: "**",
        redirectTo: "projects",
        pathMatch: "full"
      }
    ]
  },
  {
    path: "**",
    component: PageNotFoundComponent
  },
];

Answer 1

Я думаю, вам нужно будет хранить значение ": id" где-то как в локальном хранилище между запросами, т.е.сохраните последний «идентификатор».

Укажите произвольное значение в вашем перенаправлении, а затем сохраните его в вашем DashboardComponent.Найдите 9999 (или что-то еще) и замените значение из локального хранилища.

  ngOnInit() {
localStorage.getItem('id'))
  }

{
    path: "dashboard",
    redirectTo: "dashboard/99999", //How to redirect to dashboard/:id ?
    pathMatch: "full"
  }

Answer 2

Вы можете достичь этого с помощью компонента Login. После успешного входа в систему перенаправьте пользователя на дочерний маршрут.

Получить идентификатор пользователя из полезной нагрузки или от вашего вызова API зависит от вашей структуры и передать его на маршрут.

this.router.navigate(['/dashboard/' + id + '/projects']);

this.router является экземпляром Router.