注：以下学习笔记均来源于Angular教程_Angular8 Angular9 Angular12入门实战视频教程

一、Angular 中的路由

1、Angular 创建一个默认带路由的项目

2、Angular routerLink 跳转页面 默认路由

• 跳转页面 routerLink

• 默认路由

3、Angular routerLinkActive 设置 routerLink 默认选中路由

• routerLinkActive 的值为样式的类名

4、路由 get 传值

news 组件给 newscontent 组件传值。

• news 组件跳转的时候添加 queryParams

• newscontent 组件引入 ActivatedRoute，获取 get 方法所传的值

5、动态路由传值

• 首先在 app-routing.module.ts 中进行配置

• news 组件跳转的时候 routerLink 的第二个参数即为要传的值

• newscontent 组件获取传值

6、动态路由的 js 跳转

• 配置 productcontent 的路由

• product 组件跳转到 productcontent 组件

• product 组件需要引入 Router 模块

7、动态 get 传值的 js 跳转

• 配置 productcontent 的路由

• product 组件跳转到 productcontent 组件

• product 组件需要引入 Router 模块

8、父子路由（嵌套路由）

• 创建组件并引入组件

• 在父路由中添加路由

• 在父路由组件中使用子路由组件