Angular--路由的基础知识

前言

我们经常可以听到路由器，通过路由器我们可以连接wifi上网。今天我总结的这个路由跟路由器不是一个类型的，这个路由指的是路径，而非器材

内容

路由的内容大致有如下四种：

在查询参数中传递数据

/product?id=1&name=2
       =>   ActivatedRoute.queryParams[id]

在路由路径中传递数据

{path:/product?:id}
    =>   /product/1
       =>   ActivatedRoute.params[id]

在路由配置中传递数据

{path:/product,component:ProductComponent,data:[{isProd:true}]}
    =>   ActivatedRoute.data[0][isProd]

1.创建商品详情组件，显示商品的图片和标题
2.重构代码，把轮播图组件和商品列表组件封装进新的Home组件
3.配置路由，在导航到商品详情组件时传递商品的标题参数
4.修改App组件，根据路由显示Home组件或商品详情组件
5.修改商品列表组件，给商品标题添加贷routeLink指令的链接，导航到商品详情路由

总结

路由这方面的知识很丰富，需要在不断学习中总结！

end

谢谢您的阅读！