Angular 7无法识别名为History的路线

Question

我已经使用默认的快速入门项目设置设置了一个基本的Angular 7应用程序。 我有一个如下定义的路由文件：

//imports left out for brevity 

export const appRoutes: Routes = [
{ path: '',   component: HomeComponent},
{ path: 'Home',   component: HomeComponent},
{ path: 'History',   component: HistoryComponent},
];

@NgModule({
imports: [RouterModule.forRoot(appRoutes, { useHash: true} )], 
exports: [RouterModule]
});

export class AppRoutingModule {}

我已将我的路由文件的导入添加到了     imports:[]文件的app.module.ts部分，当我运行ng serve并打开浏览器并访问localhost:4200/#/和localhost:4200/#/Home时，随后的页面可以正常打开。但是，当我尝试访问localhost:4200/#/History时，它没有打开，并且出现以下错误：

当我将路线名称更改为其他名称时，它会很好地打开。我只是想知道为什么Angular不会将历史视为路线？

编辑：

app.module.ts：

 import { BrowserModule } from '@angular/platform-browser';
 import { NgModule } from '@angular/core'; 
 import {FormsModule, ReactiveFormsModule} from '@angular/forms';

 /* Components */
 import { AppComponent } from './app.component';
 import { HomeComponent } from './components/home/home.component';
 import { HistoryComponent } from './components/history/history.component';

 /* Routing Module */
 import { AppRoutingModule }   from './routes/app.routing.module';


 @NgModule({
 declarations: [
 AppComponent,
 HomeComponent,
 HistoryComponent
 ],
 imports: [
 BrowserModule,
 AppRoutingModule,
 FormsModule,
 ReactiveFormsModule
 ],
 providers: [],
 bootstrap: [AppComponent]
 })
 export class AppModule { }

`

app.component.ts：

 <router-outlet></router-outlet>`

app.component.ts

  import { Component } from '@angular/core';
   @Component({
   selector: 'app-root',
   templateUrl: './app.component.html',
   styleUrls: ['./app.component.css']
   })
   export class AppComponent {
   title = 'app';
   }`

Answer 1

尝试

export const appRoutes: Routes = 
[
   { path: '',   component: HomeComponent},
   { path: 'home',   component: HomeComponent},
   { path: 'history',   component: HistoryComponent}
];

Answer 2

您可以尝试以下方法：

 export const appRoutes: Routes = 
[
 { path: 'Home', component: HomeComponent},
 { path: 'History', component: HistoryComponent},
 { path: '', redirectTo: 'Home', pathMatch: 'full'}
];