Угловые маршруты, не создающие точный URL

#angular #angular-routing

#угловатый #угловая маршрутизация

Вопрос:

Угловые маршруты отключают родительский элемент и могут перейти непосредственно к дочернему элементу, когда я ожидаю получить страницу 404. это маршрут модуля приложения

 {
 path: "mocha",
 loadChildren: () =>
  import("./navigation/navigation.module").then((m) => m.NavigationModule),
  
},
{
 path : "**",
 redirectTo : "error/404"
},
 

и это дочерний маршрут в навигационном модуле

 {
path : "admin",
loadChildren: () =>
  import("./admin/admin.module").then((m) => m.AdminModule),
component : AdminComponent,
},
{
  path : "emplyer",
  loadChildren: () =>
    import("./employer/employer.module").then((m) => m.EmployerModule),
  component : EmployerComponent
  },
 

2 URL-адреса: «/mocha/admin» и «/admin» дают мне тот же результат, однако я жду, чтобы выдать ошибку в /admin

https://codesandbox.io/s/vibrant-frog-vmqjf

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

1. Если вы попробуете, какой-либо URL перенаправляет на вашу страницу 404? потому что я не вижу конфигурации для 404

2. У меня есть другой модуль для ошибок, и он отлично работает, например, если я попробую «/ adminn», это приведет меня к странице 404.

3. Не могли бы вы поделиться codesandbox или другим рабочим примером, чтобы просмотреть свой код?, поскольку в коде, которым вы делитесь, все вроде бы в порядке. Может быть, другая конфигурация неверна

4. Не совсем понял, что у вас есть, но вы можете проверить это: — В дочерних модулях маршрутизатора (admin и employer) проверьте, используется RouterModule.forChild ли вместо RouterModule.forRoot — кроме того, попробуйте использовать pathMatch: "full" в определении маршрута

5. вы можете проверить проблему здесь, если можете попробовать 2 URL-адреса «/ admin» и «/ mocha / admin» Я хочу вернуть ошибку (страница 404) при прямом использовании «/ admin» codesandbox.io/s/vibrant-frog-vmqjf

Ответ №1:

Попробуйте изменить дочерний маршрут в навигационном модуле:

  {
    path: '', // It will take the "base" route as defined in paerent route (/mocha/ in this case)
    children: [
       {
           path : "admin",
           loadChildren: () => import("./admin/admin.module").then((m) => m.AdminModule),
           component : AdminComponent,
       },
       {
           path : "emplyer",
           loadChildren: () =>
           import("./employer/employer.module").then((m) => m.EmployerModule),
           component : EmployerComponent
       },
...
 

Ответ №2:

Это не упоминается в вашем опубликованном коде, но вы должны убедиться, что вы не используете модуль администратора непосредственно в модуле приложения, что может быть причиной того, что у вас работает / admin .

Ответ №3:

 const appRoutes: Routes = [
  {
    path: "",
    redirectTo="error/404"
    pathMatch:full
  },
  {
    path: "mocha",
    component: MochaComponent,
    loadChildren: () =>
      import("./mocha/mocha.module").then((m) => m.MochaModule)
  }
]; 

Ответ №4:

проблема была в импорте, я импортировал navigation Module

 imports: [
    NavigationModule, // this module need to be deleted !
    Template Module,
    MatButtonModule,
    LayoutModule,
    
    HttpClientModule,
    BrowserModule,
    BrowserAnimationsModule,
    RouterModule.forRoot(appRoutes),
  ],