Question

我使用角度6。

我有ListComponent来显示产品列表。

我的路线

{
     path: ('list/:category/:subcategory'),
     component: ListComponent
}

标签

<a class="link" [routerLink]="['/list/' + item.titleEn ]">
    {{ item.title }}
</a>

<a class="sub-link" [routerLink]="['/list/' + item.titleEn + '/' + itemSub.titleEn ]"
    {{ itemSub.title }}
</a>

现在，当我在HomeComponent（/ home）中单击“ / list / car / bmw”时，该方法已工作并呈现ListComponent。但是当我在ListComponent（/ list / car / benz）中单击“ / list / car / bmw”时，该按钮不起作用，也不会呈现ListComponent。

Answer 1

首先加载"/list/car/bmw"时，angular会得到一条与"list/:category/:subcategory"网址匹配的准化路径"/list/car/bmw"。因此它将呈现您的组件ListComponent。
如果通过任何操作（单击按钮或锚定单击），如果您的网址更改为"/list/car/benz"，则它将不会呈现ListComponent。因为ListComponent已经加载了参数化路由'list/:category/:subcategory'。在这种情况下，路由没有改变，但路由器参数也在改变。

并检测参数更改，请使用 ActivatedRoute 检查参数的任何更改。

第1步-执行ActivatedRoute

的构造方法注入

constructor(private activatedRoute: ActivatedRoute) {
   // Code snippet
   this.subscribeRouteChange();
}

第2步-订阅以更改路线参数

subscribeRouteChange() {
    this.activatedRoute.params.subscribe((params = {}) => {
        // Will log any change to the route.
        // You can add your own logic here
        console.log(params.category);
        console.log(params.subcategory)
    });
}

更换零件时按角度重新装填零件

1 个答案: