用户登录

中秋活动:订阅年付会员送 6 个月,重订、续订送 12 个月。订阅 →

访问 posts 斜线,加上一个具体的内容 id,可以打开内容的详情页面。先在终端用命令生成一个组件,执行 ng generate 生成一个 component ,放在 modules/post/components 的下面,名字是 post-details 。

ng generate component modules/post/components/post-details

定义路由

打开 AppRoutingModule 模块,在这个模块的 routes 里面,再定义一条路由,路由的 path,也就是地址是 posts/:id,这里的 :id 是这个地址里的一个参数,也就是它的值是会发生变化的。

再用 component 设置一下对应的组件,用一下刚才我们创建的 PostDetailsComponent 组件,注意要在文件顶部导入这个组件。

预览

回到浏览器,访问一下 posts 斜线,后面加上一个内容的 id 号,页面上显示的就是 PostDetails 组件里的内容。现在不管 id 是多少,都会显示同样的内容。在后面我们会根据地址里的这个 id 参数的值,在 PostDetails 组件里显示对应的文章内容。

路由:定义带参数的路由《 Angular:起步 2 》

统计

11228
分钟
0
你学会了
0%
完成

社会化网络

关于

微信订阅号

扫描微信二维码关注宁皓网,每天进步一点