สวัสดี Signal Inputs ใน Angular 17.1.0

หลังจากที่ Angular 17.1.0 ตัวเต็มถูกปล่อยออกมา
หนึ่งในความสามารถที่น่าสนใจคือ Signal Inputs
ซึ่งก่อนนี้จะมีเรื่อง Signal ที่จะจัดการ state และการ render มาก่อนแล้ว
ดังนั้นเรามาดูกันว่า Signal Inputs มันเป็นอย่างไร และ ใช้งานอย่างไร

เริ่มด้วยด้วยการติดตั้ง หรือ upgrade Angular 17.1.0 ก่อน

[gist id="9d7346b964fb84201d4887b525d57f85" file="1.txt"]

ปกตินั้นในการส่งข้อมูลมายัง component จะใช้งานผ่าย Decorator Input
ตัวอย่าง code เป็นดังนี้

[gist id="9d7346b964fb84201d4887b525d57f85" file="demo01.ts"]

มาดู Signal Inputs กัน ว่าเป็นอย่างไร ?

[gist id="9d7346b964fb84201d4887b525d57f85" file="demo02.ts"]

ดูง่ายขึ้นไหม ?
จากนั้นถ้า Signal Input มีการเปลี่ยนแปลง
สามารถดักจับด้วยการใช้งาน function effect() ที่มีมาตั้งแต่ Angular 17 ได้เลย
และทำการ sub/unsub พวก service ต่าง ๆ ได้แบบง่าย ๆ

[gist id="9d7346b964fb84201d4887b525d57f85" file="demo03.ts"]

เริ่มเขียน code แบบอ่านง่าย ๆ เข้าใจง่าย ๆ ขึ้นมาอีก
ขอให้สนุกกับการ coding

Reference Websites

• Angular Signals: Complete Guide
• Angular Signal Inputs (Coming Soon in Angular 17.1)
• Angular Signal Inputs are here to change the game