Angular 路由配置

时间:2023-02-12 17:29:36

路由,简单的来说就是让组件之间进行跳转和参数的传递。

1、先在app目录下创建一个名为app.route.ts的路由组件

Angular 路由配置

2、打开app.route.ts 在里面创建路由组件的代码(可通过编辑器快捷生成)

Angular 路由配置

3、开始配置路由词典,引入对应的组件

Angular 路由配置

4、把代码中的forChild 改成forRoot

Angular 路由配置Angular 路由配置

5、最后导出为AppRoutingModule

Angular 路由配置

6、在app目录下找到app.module.ts

Angular 路由配置

7、最后一步,打开app.component.ts,添加<router-outlet></router-outlet>

Angular 路由配置

做完以上这几步,路由就算是配置成功,可以使用了