Ionic 4 Pass parameter to another page - ionic-framework

Question

Please help how to pass param to another page in ionc 4?
As the push and navparam function seen not working anymore in ionic4.
https://medium.com/#muthudevendra/ionic-sharing-data-between-pages-8d0412cb8f58

Answer 1

Page1.ts
public country: string;
public email: string;
public password: string;
constructor(public nav: NavController) {}
goToAboutPage() {
let params: any = {
country: this.country,
email: this.email,
password: this.password
}
this.nav.navigateForward('/identity', { state: params }); // params to pass object/array
}
Page2.ts
constructor(public router: Router){
if (router.getCurrentNavigation().extras.state) {
const params = this.router.getCurrentNavigation().extras.state;
console.log(params.email)
console.log(params.password)
console.log(params.country)
}
}

Answer 2

in page.html use like this:
<ion-button routerLink="/yourAddress" [queryParams]="{ paramName : 'paramValue' }" ></ion-button>
in page.ts use like this:
import { NavController } from '#ionic/angular';
constructor(public navCtrl: NavController) {
this.navCtrl.navigateForward('/yourAddress?paramName=' + this.paramValue);
}

Answer 3

Read up on Activated route and NavigationExtras,
on page.ts have a function probably binded to a click event
goToNextpage() {
let navigationExtras : NavigationExtras = { state: { dataToBePassed:this.param }};
this.router.navigate(['/nextpage'], navigationExtras);
}
on nextpage.ts
import { ActivatedRoute, Router } from '#angular/router';
and do your dependency injection in the constructor like
constructor(
private route: ActivatedRoute,
private router: Router,
) {
this.route.queryParams.subscribe(params => {
if (this.router.getCurrentNavigation().extras.state) {
this.var = this.router.getCurrentNavigation().extras.state.dataToBePassed;
}
console.log(this.var); // will get you the data passed with key dataToBePassed
});
}