要将Angular 10组件加载到router-outlet中,请执行以下步骤:
HomeComponent
的组件,你可以在路由配置中添加以下内容:import { HomeComponent } from './home/home.component';
// ...
const routes: Routes = [
{ path: '', component: HomeComponent },
// ...
];
app.component.html
)中,确保有一个带有router-outlet
指令的元素,用于加载路由组件。例如:
app.module.ts
)中导入了RouterModule
模块,并将其添加到imports
数组中。例如:import { RouterModule } from '@angular/router';
// ...
@NgModule({
imports: [
RouterModule.forRoot(routes),
// ...
],
// ...
})
export class AppModule { }
RouterModule
的forRoot
方法,并传入路由配置数组。例如:import { RouterModule, Routes } from '@angular/router';
// ...
const routes: Routes = [
// ...
];
@NgModule({
imports: [
RouterModule.forRoot(routes),
// ...
],
// ...
})
export class AppModule { }
/home
的组件,你可以使用routerLink
指令:Home
如果你按照以上步骤仍然无法将组件加载到router-outlet
中,请检查浏览器的开发者工具控制台,查看是否有任何错误消息。这可能会提供有关问题的更多详细信息,帮助你解决问题。