如何在 angular 11 中定义后立即使用路由变量？

问题描述

我想将路由变量用于面包屑标题。例如：

{
 path:'sample/:title',data:{
 breadcrumb:[
   {title:'sample',link:'sample'},{title:using :title variable here}
   ]
 }
}

有没有办法在定义后立即使用变量？

解决方法

您可以执行以下操作：

constructor(private router: Router  ) {}

 this.router.navigate(['/page',{ data: YourData'}]);

,

1. 如果标题是固定的，那么在路由配置中保留面包屑数据的好地方。

   {
         path:'sample',data:{
          breadcrumb:"sample"
         }
    }

2. 如果标题是可变的，您可以使用它。

   constructor(private router: Router  ) {}
   .....
   .....
   goTo() {this.router.navigate(['/page',{ data:  YourData'}]);}

但从我的角度来看，这不是一个好方法。我总是需要在需要面包屑的地方设置数据。我认为我们应该制作一个组件，在其中格式化来自 URL 的完整面包屑并将其应用于视图。之后，我们将该可共享组件用于我们的主要组件。