Angular 延迟加载再次加载相同的路线

Question

https://stackblitz.com/github/sandypm2020/BookStore

<ul class="leftNav">
  <li>
    <a routerLink="/books">Books</a>
  </li>
  <li>
    <a routerLink="/users">Users</a>
  </li>
</ul>

const routes: Routes = [
  {
    path: 'books',
    loadChildren: () => import('./book/book.module').then((m) => m.BookModule),
  },
  {
    path: 'users',
    loadChildren: () => import('./user/user.module').then((m) => m.UserModule),
  },
  { path: '', pathMatch: 'full', redirectTo: 'books' },
];

伙计们，我想使用延迟加载我有以下路线和URLs。但是由于某种原因，当我去 user 它再次加载 books 路线有人可以帮助为什么会这样吗？

Answer 1

首先：将 href 更改为 routerLink，如下所示：

<ul class="leftNav">
        <li>
          <a routerLink="/books">Books</a>
        </li>
        <li>
          <a routerLink="/users">Users</a>
        </li>
  </ul>

然后转到 UserModule 并将路由添加到导入部分，如下所示：

@NgModule({
  declarations: [UserListComponent, AddUserComponent, UserEditComponent],
  imports: [CommonModule, RouterModule.forChild(routes)],
})
export class UserModule {}

Answer 2

看到stackblitz，app.routing.module.ts不需要引入booklist组件和user组件，请移除再测试，也告诉我

Angular 延迟加载再次加载相同的路线

Angular Lazy Loading loading same route again

lazy-loading

angular-routing

angular