how to navigate fom one page to another by passing data using ionic 4 code example

Example 1: passing data from one page to another in ionic 4

import { Component, OnInit } from '@angular/core';
import { ActivatedRoute, Router } from '@angular/router';
 
@Component({
  selector: 'app-details',
  templateUrl: './details.page.html',
  styleUrls: ['./details.page.scss'],
})
export class DetailsPage implements OnInit {
 
  data: any;
 
  constructor(private route: ActivatedRoute, private router: Router) {
    this.route.queryParams.subscribe(params => {
      if (this.router.getCurrentNavigation().extras.state) {
        this.data = this.router.getCurrentNavigation().extras.state.user;
      }
    });
  }
 
  ngOnInit() { }
}

Example 2: how to pass data to another page in ionic 3

Controller - 

this.navCtrl.push(page2,{
item:item,
item2:item2
});



View - 

this.value = navParams.get('item');

Example 3: passing data from one page to another in ionic 4

<ion-header>
  <ion-toolbar>
    <ion-title>
      Ionic Data Navigation
    </ion-title>
  </ion-toolbar>
</ion-header>
 
<ion-content padding>
  <ion-button expand="full" (click)="openDetailsWithQueryParams()">
    Open with Query Params
  </ion-button>
 
  <ion-button expand="full" (click)="openDetailsWithService()">
    Open with Service
  </ion-button>
 
  <ion-button expand="full" (click)="openDetailsWithState()">
    Open with State
  </ion-button>
</ion-content>