CODEWITHSUNDEEP
angularionic-frameworkhybrid-mobile-appangular-routerlink
Leena
Leena

Reputation: 783

How to pass multiple route parameters in Ionic-Angular?

I am able to get a single param through route like page1/id1 in Ionic 5. If I want to get multiple parameters for a module, how do I do that?

Upvotes: 5

Views: 4661

Answers (1)

Leena
Leena

Reputation: 783

In app-routing.module.ts, modify the path to-

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

In the page through which you want to access this page, say for instance page0.page.html include-

<ion-item button [routerLink]="['/', 'page1', id1,id2]" >Go to Page1 </ion-item>

In page1.page.ts , in order to access these params, inclde the following in 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');
   });
}

Upvotes: 5

Related Questions