Angular 8 默认路由

Question

我有一个运行 Angular 8.2 的应用程序。除了默认路由之外，路由运行良好。

当前往

website.com

时，我想重定向至

website.com/sign-in

应用程序路由.module

const routes: Routes = [
  {
    path: '',
    redirectTo: 'sign-in',
    pathMatch: 'full'
  },
  {
    path: '',
    component: PublicLayoutComponent,
    data: { title: 'Public Views' },
    children: PUBLIC_ROUTES
  },
  {
    path: '',
    component: PrivateLayoutComponent,
    data: { title: 'Private Views' },
    children: PRIVATE_ROUTES
  },
];

公共路由模块

export const PUBLIC_ROUTES: Routes = [
  {
    path: "sign-in",
    loadChildren: () =>
      import('../features/sign-in/sign-in.module').then(
        m => m.SignInModule
      )
  }
];

私有路由.module

export const PRIVATE_ROUTES: Routes = [
  {
    path: "dashboard",
    loadChildren: () =>
      import('../features/dashboard/dashboard.module').then(
        m => m.DashboardModule
      )
  }
];

我也尝试将其添加到 app-routing.module

{
  path: '**',
  redirectTo: 'sign-in',
  pathMatch: 'full'
},

编辑：

我的所有路线都有效。当转到

website.com/sign-in

时，Angular 会查看 app-routing.module，然后查看子路由以查找路由位置。如果我添加

{
  path: '**',
  redirectTo: 'sign-in',
  pathMatch: 'full'
}

到public-routing.module，除空白之外的任何内容都将重定向到登录。

website.com/jdjhjdfjd

将转到我的登录页面，但

website.com

不会。

Answer 1

可能是因为您尚未定义登录路线

const routes: Routes = [
  {
    path: '',
    redirectTo: 'sign-in',
    pathMatch: 'full'
  },
  ...
  {
    path: 'sign-in',
    component: SignInComponent,
    data: { title: 'Private Views' },
  },
];

Answer 2

因为您在应用程序路由中具有相同的网址，所以它们会被最后一个网址覆盖。 所以你写的代码相当于（前一个被最后一个覆盖，因为它们具有相同的

path

）

const routes: Routes = [
  {
    path: '',
    component: PrivateLayoutComponent,
    data: { title: 'Private Views' },
    children: PRIVATE_ROUTES
  }
];

并且在角度中，您重定向不是为了

children

，而是为了

path

所以一定有一些带有

path: 'sign-in'

的路线

如果你想在这里使用延迟加载，应该有一个路径“sign-in”，该路径的子级中将包含 SignInModule 模块。在该模块的路由中，将有 SingnInComponent 用于

path: ''

Answer 3

您应该检查如何使用 Route Guards 或者您可以使用 Router 来重定向它：

export class AppComponent implements OnInit { 
  constructor(private router: Router) {}

  ngOnInit() {
    this.router.navigate(['sign-in'])
  }
}