ionic 4 pass parameter

บันทึกการส่งค่า parameter ใน ionic 4 ซึ่งเปลี่ยนแปลงจาก ionic 3 เล็กน้อย เมื่อผมได้ทำความเข้าใจองค์ประกอบแล้วจึงบันทึกเก็บไว้ตามความเข้าใจ โดยผมได้ดูการสอนจาก (h)ttps://www.youtube.com/watch?v=jRxPOs1OM34

โดยเค้านำเสนอวิธีการส่งค่า parameter 4 แบบ

1. Router Link
2. Push
3. Modal
4. Popover

ก่อนอื่นสร้าง ionic project ขึ้นมาใหม่

$ionic start ionic4-demo

$cd ionic4-demo //เข้าไปใน folder project ของเรา

$ionic serve //เพื่อรันแอป

จากนั้นสร้าง page มา 3 page

$ionic g page pages/second

$ionic g page pages/modal

$ionic g page pages/popover

เปิดไฟล์ app-routing.module.ts

ลบ path modal, popover ออก แล้ว แก้ไข path second page ให้ส่ง parameter groupId ไปด้วย

เปิดไฟล์ app.module.ts เพื่อ import ModalPageModule, PopoverPageModule ไว้ใน NgModule imports

เปิดไฟล์ home.page.html เพื่อสร้าง button สำหรับเรียกใช้ function

เปิดไฟล์ home.page.ts ทำการ import NavController,ModalController, PopoverController และเขียน function

เปิดไฟล์ second.page.html แสดงค่าตัวแปร

เปิดไฟล์ second.page.ts ดึงค่าตัวแปรที่จะมาจากหน้า home

เปิดไฟล์ modal.page.html เพื่อแสดงค่าตัวแปร

เปิดไฟล์ modal.page.ts เพื่อรับค่าตัวแปรที่ส่งมาจาก home

เปิดไฟล์ popover.page.ts เพื่อรับค่าตัวแปรจาก home

เปิดไฟล์ popover.page.html เพื่อแสดงค่าตัวแปร

ขอบคุณความรู้ที่ได้จากคุณ Simon Grimm

https://www.youtube.com/watch?v=jRxPOs1OM34