angular - 在 Angular 中，我可以对两个不同的路径使用相同的模块吗？

Question

我正在 Angular 8 中实现延迟加载，但陷入了困境。对于登录和注销，我使用了如下所示的相同模块。

    const myroutes : Routes = [        
        {path : 'login',loadChildren:()=>import('./login/login.module').then(m=>m.LoginModule)},       
        {path : 'logout',loadChildren:()=>import('./login/login.module').then(m=>m.LoginModule)},
        {path : 'contact',loadChildren:()=>import('./contact/contact.module').then(m=>m.ContactModule)},
        {path : 'home',loadChildren : ()=> import('./home/home.module').then(m=>m.HomeModule)},
     ]

在login.module.ts中使用类似

const myroutes : Routes = [
  {path : '',component : LoginComponent},
  {path : 'logout',component : LogoutComponent}
]

包含所有链接的模板如下

<nav class="navbar navbar-expand-sm bg-light">
        <ul class="navbar-nav">
            <li class="nav-item">
                    <a class="nav-link" routerLink="home">Home</a>
            </li> 
            <li class="nav-item">
                    <a class="nav-link" routerLink="contact">Contact</a>
            </li>
            <li class="nav-item">
                    <a class="nav-link" routerLink="login">Login</a>
            </li>
            <li class="nav-item">
                        <a class="nav-link" routerLink="logout">logout</a>
            </li>
        </ul>
      </nav>
<router-outlet></router-outlet>

但是每当我点击注销链接时，LogoutComponent.ts 总是调用登录组件。

可能发生什么情况？

Answer 1

注销组件的正确路径是登录和注销的串联，因此:

/login/logout 

所以你的routerLink变成这样:

routerLink="login/logout"