如何在 Ionic-Angular 中传递多个路由参数?

Lee*_*ari 5 hybrid-mobile-app ionic-framework angular angular-routerlink

我可以像page1/id1Ionic 5 一样通过路由获取单个参数。如果我想获取模块的多个参数,我该怎么做?

Lee*_*ari 5

app-routing.module.ts中,将路径修改为-

{
path: 'page1/:id1/:id2',
loadChildren: () => import('./pages/page1/page1.module').then(m => m.Page1PageModule)
},
Run Code Online (Sandbox Code Playgroud)

在您想要访问此页面的页面中,例如page0.page.html包含 -

<ion-item button [routerLink]="['/', 'page1', id1,id2]" >Go to Page1 </ion-item>
Run Code Online (Sandbox Code Playgroud)

page1.page.ts中,为了访问这些参数,请在 ngOnInit 中包含以下内容 -

import { ActivatedRoute, Router} from '@angular/router';

..
constructor(private route : ActivatedRoute, private router : Router){}

ngOnInit() {
   this.route.paramMap.subscribe(params => {
      let id1 = params.get('id1');
      let id2 = params.get('id2');
   });
}
Run Code Online (Sandbox Code Playgroud)