ionic day2

<ion-header>
  <ion-toolbar>
    <ion-title>
      Ionic Blank
    </ion-title>
  </ion-toolbar>
</ion-header>

<ion-content padding>
<ion-input placeholder="กรุณาระบุข้อความ" type="text" [(ngModel)]="txt1">
</ion-input>

  <ion-grid>
    <ion-row>
      <ion-col>
        Link แบบที่ 1
        <ion-button href="page2/sss" color="primary">
          <ion-icon name="airplane"></ion-icon>
          go to page2
        </ion-button>
      </ion-col>
      <ion-col>
        Link แบบที่ 2
        <ion-button (click)="gopage2(txt1)" color="success">
          go to page2 #2
        </ion-button>
      </ion-col>

    </ion-row>
  </ion-grid>

{{input1}}

</ion-content>

import { Component } from '@angular/core';
import { Router } from '@angular/router';
import { NavController } from '@ionic/angular';

@Component({
  selector: 'app-home',
  templateUrl: 'home.page.html',
  styleUrls: ['home.page.scss'],
})
export class HomePage {
   public input1:string;
   public static input2:number;
    constructor(private navCtrl:NavController){}
      gopage2(x){
        //alert("clicked");
        //save to db success
        console.log("clicked");
        this.input1=x;
        this.navCtrl.navigateForward('page2/'+x);

      }
 
}

<ion-header>
  <ion-toolbar>
    <ion-title>page2</ion-title>
  </ion-toolbar>
</ion-header>

<ion-content padding>
{{param1}}
</ion-content>

import { Component, OnInit } from '@angular/core';
import { ActivatedRoute } from '@angular/router';

@Component({
  selector: 'app-page2',
  templateUrl: './page2.page.html',
  styleUrls: ['./page2.page.scss'],
})
export class Page2Page implements OnInit {
 param1:string;
  constructor(private route:ActivatedRoute) { }

  ngOnInit() {
    this.param1=
    this.route.snapshot.paramMap
    .get('param1');
  }

}

import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { FormsModule } from '@angular/forms';
import { Routes, RouterModule } from '@angular/router';

import { IonicModule } from '@ionic/angular';

import { Page2Page } from './page2.page';

const routes: Routes = [
 
  {
    path: ':param1',
    component: Page2Page
  }
];

@NgModule({
  imports: [
    CommonModule,
    FormsModule,
    IonicModule,
    RouterModule.forChild(routes)
  ],
  declarations: [Page2Page]
})
export class Page2PageModule {}