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: 'Home', component: HomeComponent},
 { path: 'History', component: HistoryComponent},
 { path: '', redirectTo: 'Home', pathMatch: 'full'}
];

Answer 2

попробуйте

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