角度 8 路由不重定向到正确的页面答案

【问题标题】：angular 8 routing not redirectly to correct page角度 8 路由不重定向到正确的页面
【发布时间】：2020-02-04 13:12:58
【问题描述】：

我是 Angular 8 的新手。任何帮助或提示将不胜感激！！这是我的 app.routing.module.ts：

import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import { LabViewerComponent } from './lab-viewer/lab-viewer.component';
import { HomeComponent } from './home/home.component';

const routes: Routes = [
  { path: '', component: HomeComponent},
  { path: 'home', component: HomeComponent},
  { path: 'LabViewerPDF', component: LabViewerComponent}
];

@NgModule({
imports: [RouterModule.forRoot(routes, {useHash: true})],
exports: [RouterModule]
})
export class AppRoutingModule { }

这是我的 home.component.html：

Home
<a  (click)="selectLab()">Click here to download my Plan (PDF)</a>

<router-outlet></router-outlet>

这是我的 app.component.html：

app component
<a  (click)="selectLab()">Click here to download my Plan (PDF)</a>

<router-outlet></router-outlet>

不知道为什么这个网址： http://localhost:4200/#/home

显示：应用组件点击这里下载我的计划 (PDF)首页点击这里下载我的计划 (PDF)

应该是： home component 点击这里下载我的计划 (PDF)Home 点击这里下载我的计划 (PDF)

【问题讨论】：

由于 {useHash: true}，您的 URL 中有一个 #，您能指定 pb 吗？

标签： angular

【解决方案1】：

显示您的AppComponent，包含根路由器出口：

app component
<a  (click)="selectLab()">Click here to download my Plan (PDF)</a>

<router-outlet></router-outlet>

当您导航到home 时，路由器插座将按照命令填充HomeComponent（其余部分保持不变），因此您会得到：

<a  (click)="selectLab()">Click here to download my Plan (PDF)</a>

<!-- main router outlet's contents here: -->
Home
<a (click)="selectLab()">Click here to download my Plan (PDF)</a>
<!-- this router outlet will be filled, if `home` has any child routes -->
<router-outlet></router-outlet>

【讨论】：

【解决方案2】：

<router-outlet></router-outlet>

包含当前路线。您想通过单击某处的路由器链接将主页加载到该路由器插座中。我怀疑这是你的意思。

Home
<a  (click)="selectLab()">Click here to download my Plan (PDF)</a>

app component
<router-outlet></router-outlet>

【讨论】：