angular - 如何为新的子路由重新加载 Angular 路由器

我正在创建一个能够在网站上显示产品的 Angular 应用程序。当我单击某个产品时，预期的行为是将我带到产品描述组件，并且确实如此。但是，在产品描述组件中，单击相关产品会更改 URL，但页面保持不变。我该怎么做才能改变它？

到目前为止，我已经尝试在路由模块中将“pathMatch”设置为“full”。我的路由器插座位于根 app.component 文件中，到目前为止，导航已按预期在整个应用程序中运行。

这是 Routes 数组中的路线：

{ path: 'product/:prod_id', component: ProductDescriptionComponent, pathMatch: 'full' },

这是链接到 ProductDescription 组件的产品组件标题

<a [routerLink]="['/product', bag.prod_id]" class="link-a">{{bag.title}}</a>

单击产品时没有错误消息。

标签： angulartypescriptangular-routingangular-router

我的路由器插座在根 index.html 文件中，这是你的问题！

你的应用组件应该有一个路由出口，index.html 不能渲染组件。

<router-outlet></router-outlet>

这就是路由的组件将呈现的地方。

这是一个实现路由的简单 StackBlitz。