如何修复 Angular 路由中的这个错误？答案

【问题标题】：How to fix this error in Angular routing?如何修复 Angular 路由中的这个错误？
【发布时间】：2022-01-05 05:34:46
【问题描述】：

import { NgModule } from '@angular/core';
import { RouterModule, Routes } from '@angular/router';
import {HomeComponent} from "./home/home.component";
import {SettingsComponent} from "./settings/settings.component";

const routes: Routes = [
  {path: 'home', component: HomeComponent},
  {path: 'settings', component: SettingsComponent},
  {path: '', redirectTo: 'home', pathMatch: 'full'
  },
];

@NgModule({
  imports: [RouterModule.forRoot(routes)],
  exports: [RouterModule]
})
export class AppRoutingModule {
}
export const routingComponents = [HomeComponent, SettingsComponent]

它工作得很好，但是当我将private homeservice: HomeService 添加到我的home.component.ts 的构造函数时，我的应用程序开始在app.component.html 中向我显示一个白页，我什么也做不了。如何解决此路由问题？

【问题讨论】：

这个问题可以通过显示 HomeComponent 来改善。您是否通过在 AppModule 或 HomeComponent 的 providers 中添加 HomeService 来注册/注入服务？并提供您遇到的错误的信息。
您遇到的错误是什么？请提供一个可重现的最小示例，清楚地说明您面临的问题。理想情况下，有人可以将代码放入 stackblitz.com 之类的在线 IDE 中，然后立即着手解决问题，而无需先重新创建它

标签： javascript node.js angular

【解决方案1】：

将路由器插座添加到您的 app.component.html

<router-outlet></router-outlet>

【讨论】：

【解决方案2】：

我相信你没有在模块中添加 HomeService。您可以将其添加到模块的 Provider 部分。所以我认为它解决了你的问题

providers: [ HomeService ]

【讨论】：