วันเสาร์ที่ 21 กุมภาพันธ์ พ.ศ. 2558

AngularJS part 4

Two-way Data Binding


>> หัวใจคือการสื่อสารสองทางระหว่าง model กับ view ง่ายๆว่าเมื่อ model กับ view ใช้ข้อมูลเดียวกัน ข้อมูลที่ model เปลี่ยนจะส่งผลให้ข้อมูลที่ view เปลี่ยน หรือข้อมูลที่ view เปลี่ยนจะส่งผลให้ข้อมูลที่ model เปลี่ยนตาม ดังตัวอย่างต่อไปนี้
- สร้างแท็ก input มีชนิดเป็น text สำหรับกรอกข้อมูลลงไป
- สร้างแท็ก p สำหรับแสดงผลข้อมูลที่เราได้กรอกลงไปในช่องแท็ก input ข้างต้น
- ใช้ directive ที่ชื่อ ng-model กับแท็ก input เพื่อผูก (bind) ตัวแปรสำหรับเก็บข้อมูลนั้นกับส่วนแสดงผล

>> ผลลัพธ์คือ
- เมื่อพิมพ์ข้อความใดๆในช่องของแท็ก input จะส่งผลให้ข้อความนั้นปรากฏในแท็ก p ด้วย

>> ศึกษาเพิ่มเติม
- https://docs.angularjs.org/tutorial/step_04

ไม่มีความคิดเห็น:

แสดงความคิดเห็น