Angular 无法匹配任何路由.URL段：'；英雄'；

我的工作基于Angular.io上提供的教程Tour of Heroes tutorial.

该应用程序是使用以下命令创建的:

ng new toh --no-standalone --routing --ssr=false

I understand that "standalone" is the new default, but I opted to do without it since my company is using 100.

然而，我遇到了一个我无法解决的问题，它从Chapter 5 (Routing)开始.

按照说明添加了第app-routing.module.ts个文件后，我被告知要在第app.component.html个文件中添加一个router-outlet；这样做之后，我应该能够浏览到第/heroes个(完整的URL:http://localhost:4200/heroes)，并查看前面章节中构建的英雄列表.

但是，控制台中出现以下错误:

main.ts:6 ERROR Error: NG04002: Cannot match any routes. URL Segment: 'heroes'
    at Recognizer.noMatchError (router.mjs:3654:12)
    at router.mjs:3687:20
    at catchError.js:10:39
    at OperatorSubscriber2._this._error (OperatorSubscriber.js:25:21)
    at Subscriber2.error (Subscriber.js:43:18)
    at Subscriber2._error (Subscriber.js:67:30)
    at Subscriber2.error (Subscriber.js:43:18)
    at Subscriber2._error (Subscriber.js:67:30)
    at Subscriber2.error (Subscriber.js:43:18)
    at Subscriber2._error (Subscriber.js:67:30)
Promise.then (async)        
(anonymous) @   main.ts:6
Show 26 more frames

• 我已try 将路径设置为heroes和/heroes
• 我已try 在路由定义中添加pathMatch: 'full'.
• 在这个文件中，我已经try 将HeroesComponent定义显式添加到imports数组中.

FWIW，在我注意到控制台错误之前，我try 跳过它，创建DashboardComponent并添加导航按钮.但无论我是手动浏览到/heroes，还是单击按钮将我带到那里，都会出现此错误.

这是完整的src/app/app-routing.module.ts号文件.

import { NgModule } from '@angular/core';
import { RouterModule, Routes } from '@angular/router';
import { HeroesComponent } from './heroes/heroes.component';

const routes: Routes = [
  { path: 'heroes', component: HeroesComponent, },
]

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

这是我的package.json美元

  "dependencies": {
    "@angular/animations": "^17.0.0",
    "@angular/common": "^17.0.0",
    "@angular/compiler": "^17.0.0",
    "@angular/core": "^17.0.0",
    "@angular/forms": "^17.0.0",
    "@angular/platform-browser": "^17.0.0",
    "@angular/platform-browser-dynamic": "^17.0.0",
    "@angular/router": "^17.0.0",
    "rxjs": "~7.8.0",
    "tslib": "^2.3.0",
    "zone.js": "~0.14.2"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "^17.0.8",
    "@angular/cli": "^17.0.8",
    "@angular/compiler-cli": "^17.0.0",
    "@types/jasmine": "~5.1.0",
    "jasmine-core": "~5.1.0",
    "karma": "~6.4.0",
    "karma-chrome-launcher": "~3.2.0",
    "karma-coverage": "~2.2.0",
    "karma-jasmine": "~5.1.0",
    "karma-jasmine-html-reporter": "~2.1.0",
    "typescript": "~5.2.2"
  }