Question

我正试图从一个父母链接到另一个父母。

例如，在下面，我想从一个“仪表板”链接到另一个“仪表板”

当我从“主页”链接到仪表板时，所有链接都起作用。他们看起来像这样：

<a [routerLink]="['/dashboard', dashboard.Id]">

但是，当我在仪表板中并链接到另一个仪表板时，URL会更改，但仪表板保持不变。

<a [routerLink]="['/dashboard', nextdashboard.Id]">

如果我使用“下一个仪表板” URL刷新页面，则会加载“下一个仪表板”。

我在做什么错了？

const appRoutes: Routes = [
    {
      path: '',
      component: Home
    },
    {
      path: 'dashboard/:id',
      component: Dashboard,
      children: [
        {
          path: 'Stores', component: StoresComponent
        },
        {
          path: 'Websites', component: WebsitesComponent
        }
      ]
    }
]

编辑：在我的仪表板组件中，我正在订阅参数。我也正在打电话给服务来获得新订单。但是，这仅在最初从Home路由到Dashboard到Dashboard时才起作用。

当我console.log ID时，没有看到更新。

this.route.paramMap.subscribe(params => {this.Id = params.get('id')}); 
this.orderjson = this.dashboardService.getOrders().filter((obj) => obj.Id=== this.Id);

Answer 1

在类似的情况下，我可能要从/product/5路由到/product/42。

我在组件中使用如下代码：

  ngOnInit(): void {
    // Read the product Id from the route parameter
    this.sub = this.route.paramMap.subscribe(
      params => {
        const id = +params.get('id');
        this.getProduct(id);
      }
    );
}

此代码监视route参数是否有任何更改。当参数确实发生更改时，params.get从路由中获取参数，然后使用它来获取该路由的数据。

由于数据绑定在模板中，因此新数据才出现。

您的代码需要看起来像这样：

this.route.paramMap.subscribe(
    params => {
       this.Id = params.get('id');
       this.orderjson = this.dashboardService.getOrders().filter((obj) => obj.Id=== this.Id);
});

更改ID后，重新执行的 only 代码就是订阅中的代码。因此，当ID更改时，您的this.dashboardService不会被执行。它需要驻留在subscribe内。

父母之间的链接（Angular 7）

1 个答案: