如何在应用程序路由模块中将同一组件两次用于不同路径

vatpfxk5  于 2021-09-29  发布在  Java
关注(0)|答案(1)|浏览(190)

我创建了两个不同的方法,希望通过传递id和状态来调用一个组件。我需要使用相同的组件在路由模块中创建2条路径。
这样地:

{path:'Generatereport/:state/:city/:status/:financedBy',component:GeneratereportComponent},
{path:'Generatereport/:state',component:GeneratereportComponent},
vs91vp4v

vs91vp4v1#

当路由模块中的两条路径具有相同的组件时,最好使用queryparams
删除下面的路由

{path:'Generatereport/:state/:city/:status/:financedBy',component:GeneratereportComponent},

替换为下面的路由

{path:'Generatereport',component:GeneratereportComponent},

将以下代码添加到按钮操作

constructor(private router: Router) {}

 this.router.navigate(['/Generatereport/'], {
    queryParams: {
                    state: 'State',
                    city: 'City',
                    status:'OK',
                    financedBy:'Financed By'
                  }
  });

从generatereportcomponent检索数据

constructor(private _Activatedroute: ActivatedRoute) {
    this._Activatedroute.queryParams.subscribe((v) => {
      console.log(v);
    });
  }

相关问题