角9路由器重定向与**不能正常工作

Question

我有**路径，如果路由为not found，它应该加载landing，但是它每次都会加载登陆，例如www.page.com/ ->显示有www.page.com/联系人url登陆，但是联系人在我的页面中存在，只有在没有找到路由的情况下才能加载它?

const routes: Routes = [
  {
    path: AppRoutes.admin,
    loadChildren: () => import('./admin/admin.module').then(m => m.AdminModule),
    pathMatch: 'full'
  },
 {
path: "**",
loadChildren: () => import('./public/landing/landing.module').then(m => m.LandingModule),
 }
  {
    path: '',
    loadChildren: () => import('./public/landing/landing.module').then(m => m.LandingModule),
  },
  {
    path: `${AppRoutes.content}/:name`,
    loadChildren: () => import('./public/contents/contents.module').then(m => m.ContentsModule),
  },

  {
    path: AppRoutes.cars,
    loadChildren: () => import('./public/cars/cars.module').then(m => m.CarsModule),
  },
  {
    path: AppRoutes.private,
    loadChildren: () => import('./public/tours/tours.module').then(m => m.ToursModule),
  },
  {
    path: AppRoutes.vehicles,
    loadChildren: () => import('./public/carlist/carlist.module').then(m => m.CarlistModule),
  },
  {
    path: `${AppRoutes.paymentsCancel}`,
    loadChildren: () => import('./public/cancel/cancel.module').then(m => m.CancelModule),
  },
  {
    path: `${AppRoutes.paymentsConfirm}`,
    loadChildren: () => import('./public/success/success.module').then(m => m.SuccessModule),
  },

];

有什么简单的方法可以将所有错误的url重定向到特定的模块吗？我是说如果没有找到路由器url。

Answer 1

你需要把外卡路线放在最下面。路由器检查它能找到的第一个匹配。

const routes: Routes = [
  // ...
  {
    path: `${AppRoutes.paymentsConfirm}`,
    loadChildren: () => import('./public/success/success.module').then(m => m.SuccessModule),
  },
  {
    path: "**",
    loadChildren: () => import('./public/landing/landing.module').then(m => m.LandingModule),
  }
];

这在文档中有详细的解释。

路由命令 路由的顺序很重要，因为路由器在匹配路由时使用第一匹配的赢策略，所以更多的特定路由应该放在较少的特定路由之上。首先使用静态路径列出路由，然后是空路径路由，这与默认路径匹配。通配符路由是最后一条，因为它匹配每个URL，而路由器只在没有其他路由匹配的情况下才选择它。

Answer 2

您应该在路线的末尾移动未找到的路线。

const routes: Routes = [
  {
    path: AppRoutes.admin,
    loadChildren: () =>
      import('./admin/admin.module').then((m) => m.AdminModule),
    pathMatch: 'full',
  },
  {
    path: '',
    loadChildren: () =>
      import('./public/landing/landing.module').then((m) => m.LandingModule),
  },
  {
    path: `${AppRoutes.content}/:name`,
    loadChildren: () =>
      import('./public/contents/contents.module').then((m) => m.ContentsModule),
  },

  {
    path: AppRoutes.cars,
    loadChildren: () =>
      import('./public/cars/cars.module').then((m) => m.CarsModule),
  },
  {
    path: AppRoutes.private,
    loadChildren: () =>
      import('./public/tours/tours.module').then((m) => m.ToursModule),
  },
  {
    path: AppRoutes.vehicles,
    loadChildren: () =>
      import('./public/carlist/carlist.module').then((m) => m.CarlistModule),
  },
  {
    path: `${AppRoutes.paymentsCancel}`,
    loadChildren: () =>
      import('./public/cancel/cancel.module').then((m) => m.CancelModule),
  },
  {
    path: `${AppRoutes.paymentsConfirm}`,
    loadChildren: () =>
      import('./public/success/success.module').then((m) => m.SuccessModule),
  },
  {
    path: '**',
    loadChildren: () =>
      import('./public/landing/landing.module').then((m) => m.LandingModule),
  },
];