2

所以我有一个 angular4 应用程序使用import {RouterModule, Routes } from '@angular/router'

我的路线配置是这样设置的：

const appRoutes: Routes = [
  {path: '', redirectTo: 'home', pathMatch: 'full',canActivate: [AuthGuard]},
  {path:'login', component:LoginComponent},  
  {path:'home', component:HomeComponent, canActivate: [AuthGuard]},  
  {path:'profile', component:UserProfileComponent, canActivate: [AuthGuard] },
  {path:'record', component:RecordComponent, canActivate: [AuthGuard]},
]

在我的导航栏 html 中使用

<ul class="navbar-nav ml-auto">
            <li class="nav-item" [routerLinkActive]="['active']" [routerLinkActiveOptions]="{exact: true}">
                <a [routerLink]="['/home']" class="nav-link"><i class="fas fa-home fa-2x"></i></a>
            </li>
            <li class="nav-item" [routerLinkActive]="['active']" [routerLinkActiveOptions]="{exact: true}">
                <a [routerLink]="['/profile']" class="nav-link"><i class="fas fa-user fa-2x"></i></a>
            </li>
        </ul>

在我的页面之间路由。问题是，每次我点击导航栏中的链接时，都会出现新页面，但它在前一个页面的顶部，我的意思是如果我向下滚动我可以看到上一页（但导航栏是不重复）

不确定这是否相关，但我<router-outlet>在我的 app-component.html中使用

4

2 回答 2

0

这是因为您在 app.component.html 中放置了登录 html。替换当前路由的模板，只是这个文件中所有的html都是常量。

您可以创建一个单独的登录组件。默认情况下导航到登录组件。不要在 app.component.html 中保留登录 html

我已经描述了登录组件是这里的一个例子..

于 2020-04-30T23:16:51.583 回答
0

错误可能会导致在路由器插座中显示一个组件的中断，请尝试在从一个链接切换到另一个链接时检查控制台 javascript 中是否存在错误

于 2018-01-11T22:03:42.777 回答