我的��由配置如下:
RouterModule.forRoot([
{ path: '', redirectTo: 'main', pathMatch: 'full' },
{ path: 'main', component: SummaryComponent, children: [
{ path: 'data/:deviceId/:incidentId', component: DeviceMetricsComponent },
{ path: 'incident/analysis/:incidentId', component: IncidentAnalysisComponent },
]
},
{ path: 'test', component: TestFullPageComponent, children: [
{ path: 'test2', component: TestFullPageChildComponent}
]
},
{ path: 'logs/jobs/:jobtype', component: JobLogsComponent, pathMatch: 'full' },
{ path: '**', redirectTo: 'main' }
])
这是我的“主”模板:
<div class="row">
<div class="col-md-12">
<!-- Some links are in this table that load into the router-outlet below -->
<app-incident-node-table [tableTitle]="incidentNodeTableTitle" [parentSubject]="incidentNodesSubject"></app-incident-node-table>
</div>
</div>
<div class="row" style="margin-top: 500px;">
<div class="col-md-12">
<div id="childResult">
<router-outlet></router-outlet>
</div>
</div>
</div>
当我第一次访问此页面并点击链接时,它会按预期加载到<router-outlet>
中。此时我的网址变成类似于http://localhost:4200/main/incident/analysis/3816913766390440113
的内容。
然而,在该表格中悬停的任何其他链接都显示不同的URL,但是一旦它们被点击,新内容就不会加载到<router-outlet>
中。
编辑: IncidentNodeTable模板中的链接如下所示:
<span><a pageScroll [pageScrollOffset]="60" [routerLink]="['/main/incident/analysis', row.IncidentId]">Analyze</a></span>