Question

角度9。子组件未加载延迟加载的模块组件。这是我的代码。

app-routing.module.ts

  {
    path: '',
    redirectTo: '/auth',
    pathMatch: 'full'
  },
  {
    path: 'auth',
    loadChildren: () => import('./pages/auth/auth.module').then(m => m.AuthModule),
  }

auth.module.ts

  {
    path: '',
    component: AuthRootComponent,
    children: [
      { path: 'login', component: LoginComponent},
      { path: 'forgot', component: ForgotPasswordComponent},
      { path: '', redirectTo: 'login', pathMatch: 'full' },
    ]
  }

当我使用 localhost：4200 / 时，它会将我重定向到 localhose：4200 / auth 。它不加载登录组件。

但是当我在浏览器中点击url（ localhost：4200 / auth ）时，它将加载登录组件，并且将需要新的url为 localhost：4200 / auth / login < / strong>。

请告诉我，为什么在加载auth模块且URL为 localhost：4200 时，为什么不从子数组加载登录名？ URL应该是 localhost：4200 / auth / login ，但现在获取的URL是 localhost：4200 / auth

Answer 1

我认为您必须从redirectTo: '/auth'更改为redirectTo: 'auth'。这是因为当您使用绝对重定向（例如/auth）时，将只允许执行一次重定向操作，在这种情况下，该操作将转到/auth，这意味着其他任何重定向（例如redirectTo: 'login'）都将被忽略。

Here's会在其中检查是否存在任何绝对重定向：

if (allowRedirects && this.allowRedirects) {
    return this.expandSegmentAgainstRouteUsingRedirect(
      ngModule, segmentGroup, routes, route, paths, outlet);
}

here指出绝对重定向后，不能再进行其他任何重定向：

if (e instanceof AbsoluteRedirect) {
  // after an absolute redirect we do not apply any more redirects!
  this.allowRedirects = false;
  // we need to run matching, so we can fetch all lazy-loaded modules
  return this.match(e.urlTree);
}

绝对重定向与相对重定向

我的GH repo 的摘录。

redirectTo: 'foo/bar'和 redirectTo: '/foo/bar'之间的区别在于：

/-将再次从根（路由的第一个最外面的数组）开始
``-将从当前路线所在的数组中的第一条路线开始搜索

带有子组件默认路由的角延迟加载模块

1 个答案:

绝对重定向与相对重定向