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

标签 angular angular-routing

我正在 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 总是调用登录组件。

可能发生什么情况?

最佳答案

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

/login/logout 

所以你的routerLink变成这样:

routerLink="login/logout"

关于angular - 在 Angular 中,我可以对两个不同的路径使用相同的模块吗?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/58049043/

相关文章:

javascript - 如何将polyfills和外部库与Rollup JS捆绑在一起?

javascript - 导入一个没有 Angular 6 路径的模块

typescript - Angular 2 - 在输入变量更改时更改邻居输入变量

javascript - 使用 Material Sidenav 登录和注销路由

Angular 6 Safari 路由器相关错误

html - 'mat-slide-toggle' 在导入后不是已知元素

node.js - 将 nbind 与 Angular 5 和 TypeScript 一起使用

angular - 从 Angular 2路由获取激活路由

angular - 将 Angular 路由的路径提取到单独的文件中

angular - RouterLink 通过替换 ?与 %3F