重定向到另一个路径而不是 angular 4 中给出的路径

Question

应用路线：

[
    { path: '', loadChildren: './layout/layout.module#LayoutModule', canActivate: [AuthGuard] },
    { path: 'login', loadChildren: './login/login.module#LoginModule' },
    { path: 'dashboard', loadChildren: './layout/layout.module#LayoutModule' },
    { path: 'error', loadChildren: './server-error/server-error.module#ServerErrorModule' },
    { path: 'access-denied', loadChildren: './access-denied/access-denied.module#AccessDeniedModule' },
    { path: 'not-found', loadChildren: './not-found/not-found.module#NotFoundModule' },
    { path: '**', redirectTo: 'not-found' }
]

LayoutModule 路由：

   [{
        path: '',
        component: LayoutComponent,
        children: [
            { path: '', redirectTo: 'dashboard' },
            { path: 'allcookies' , loadChildren: './allcookies/allcookies.module#AllcookiesModule' },
            { path: 'dashboard', loadChildren: './dashboard/dashboard.module#DashboardModule' },
            { path: 'details', loadChildren: './details/details.module#DetailsModule' },
            { path: 'domains', loadChildren: './domains/domains.module#DomainsModule' },
        ]
    }]

我有这样的 DetailsModule 路由配置，

[
  { path : '' , redirectTo: 'email-details' },
  { path : 'email-details' , component : EmailDetailsComponent },
  { path : 'email-details/:email_id' , component : EmailDetailsComponent },
  { path : 'email-details/:email_id/:curr_page' , component : EmailDetailsComponent },
  { path : 'fingerprint-details/:fp_id/:fp_page/domains/:user_id/:domain_page' , component : FingerprintDetailsComponent },
  { path : 'fingerprint-details/:fp_id/:fp_page/domains/:user_id' , component : FingerprintDetailsComponent },
  { path : 'fingerprint-details/:fp_id/:fp_page' , component : FingerprintDetailsComponent },
  { path : 'fingerprint-details/:fp_id' , component : FingerprintDetailsComponent },
  { path : 'fingerprint-details' , component : FingerprintDetailsComponent }
]

我给了url

http://localhost:4302/details/fingerprint-details

但是它 os 重定向到

http://localhost:4302/details/email-details/fingerprint-details

Answer 1

在redirectTo 属性中，你应该写从路由级别的绝对路径。我也总是在我的所有路线中使用 pathMatch: 'full' 以确保我不会涉及相对路径。

使用该配置进行测试：

[
  { path : '' , redirectTo: '/email-details', pathMatch: 'full'},
  { path : 'email-details' , pathMatch: 'full', component : EmailDetailsComponent },
  { path : 'email-details/:email_id' , pathMatch: 'full', component : EmailDetailsComponent },
  { path : 'email-details/:email_id/:curr_page' , pathMatch: 'full', component : EmailDetailsComponent },
  { path : 'fingerprint-details/:fp_id/:fp_page/domains/:user_id/:domain_page' , pathMatch: 'full', component : FingerprintDetailsComponent },
  { path : 'fingerprint-details/:fp_id/:fp_page/domains/:user_id' , pathMatch: 'full', component : FingerprintDetailsComponent },
  { path : 'fingerprint-details/:fp_id/:fp_page' , pathMatch: 'full', component : FingerprintDetailsComponent },
  { path : 'fingerprint-details/:fp_id', pathMatch: 'full', component : FingerprintDetailsComponent },
  { path : 'fingerprint-details' , pathMatch: 'full', component : FingerprintDetailsComponent }
]

这是文档对应的 link： https://angular.io/guide/router#redirecting-routes

Answer 2

昆汀先于我。

https://angular.io/guide/router

"A redirect route requires a pathMatch property to tell the router how to match a URL to the path of a route. The router throws an error if you don't."

重定向到另一个路径而不是 angular 4 中给出的路径

Redirecting to another path instead of given in angular 4

angular

angular4-router