javascript - 如何设置 Angular 路由

Question

Here是我的工作。

我设置了一个守卫，将请求 URI/admin 转发到/login，详细信息可以引用/admin/admin.guard.ts。

效果很好。但是，当请求URI为/admin/abc时，它不起作用。

以下是/admin/admin-routing.module.ts内容:

import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import { AdminComponent } from './admin.component';
import { AdminGuard } from './admin.guard';
const routes: Routes = [
  {
    path: 'admin',
    canActivate: [AdminGuard],
    component: AdminComponent,
    children: [
      {
        path: '',
        redirectTo: 'admin',
        pathMatch: 'full'
      },
      {
        path: '**',
        redirectTo: 'admin',
        pathMatch: 'full'
      }
    ]
  }
];

@NgModule({
  imports: [RouterModule.forChild(routes)],
  exports: [RouterModule]
})
export class AdminRoutingModule { }

如何解决这个问题？

Answer 1

使用绝对路径进行重定向:

const routes: Routes = [
{
  path: 'admin',
  canActivate: [AdminGuard],
  component: AdminComponent,
  children: [
    {
      path: '',
      redirectTo: '/admin',
      pathMatch: 'full'
    },
    {
      path: '**',
      redirectTo: '/admin',
      pathMatch: 'full'
    }
  ]
}
];

如果使用相对路径，则会出现无限循环的重定向。从/admin/123到/admin/admin再到/admin/admin等等。