SAP UI5 - การผูกข้อมูล
ใน SAP UI5 data binding conceptใช้เพื่ออัปเดตข้อมูลโดยอัตโนมัติโดยผูกข้อมูลกับส่วนควบคุมที่เก็บข้อมูลแอปพลิเคชัน การใช้การผูกข้อมูลคุณสามารถผูกการควบคุมแบบง่าย ๆ เช่นช่องข้อความปุ่มธรรมดาไปยังข้อมูลแอปพลิเคชันและข้อมูลจะอัปเดตโดยอัตโนมัติเมื่อมีค่าใหม่
การใช้การผูกข้อมูลสองทางข้อมูลแอปพลิเคชันจะถูกอัพเดตเมื่อค่าของการควบคุมที่ถูกผูกไว้เปลี่ยนแปลงไป ค่านี้สามารถเปลี่ยนแปลงได้ด้วยวิธีการต่างๆเช่นการป้อนข้อมูลของผู้ใช้เป็นต้น
ใน SAP UI5 สามารถใช้โมเดลข้อมูลที่แตกต่างกันสำหรับการเชื่อมโยงข้อมูล โมเดลข้อมูลเหล่านี้รองรับคุณสมบัติต่างๆ -
โมเดล JSON
โมเดล JSON ใช้เพื่อผูกอ็อบเจ็กต์ JavaScript กับคอนโทรล โมเดลข้อมูลนี้เป็นโมเดลฝั่งไคลเอ็นต์และแนะนำสำหรับชุดข้อมูลขนาดเล็ก ไม่มีกลไกใด ๆ สำหรับการเพจหรือการโหลดบนเซิร์ฟเวอร์
คุณสมบัติที่สำคัญ ได้แก่ -
- โมเดล JSON สำหรับการเชื่อมโยงข้อมูลรองรับข้อมูลในรูปแบบสัญกรณ์ JavaScript
- รองรับการผูกข้อมูลสองทาง
Creating a model instance −
Var oModel = new sap.ui.model.json.JSONModel(dataUrlorData);
แบบจำลอง XML
รูปแบบ XML ของการผูกข้อมูลช่วยให้คุณสามารถผูกการควบคุมกับข้อมูล XML ใช้สำหรับอ็อบเจ็กต์ไคลเอนต์และสำหรับชุดข้อมูลขนาดเล็ก ไม่มีกลไกใด ๆ สำหรับการเพจฝั่งเซิร์ฟเวอร์หรือการโหลด
คุณสมบัติที่สำคัญ ได้แก่ -
- โมเดล XML ของการผูกข้อมูลรองรับข้อมูล XML
- นอกจากนี้ยังรองรับการผูกข้อมูลสองทาง
Creating a model instance −
Var oModel = new sap.ui.model.xml.XMLModel(dataUrlorData);
แบบจำลอง OData
โมเดล OData เป็นโมเดลฝั่งเซิร์ฟเวอร์ดังนั้นข้อมูลทั้งหมดจึงพร้อมใช้งานที่ฝั่งเซิร์ฟเวอร์ ฝั่งไคลเอ็นต์สามารถเห็นเฉพาะแถวและฟิลด์และคุณไม่สามารถใช้การเรียงลำดับและการกรองที่ฝั่งไคลเอ็นต์ได้ จำเป็นต้องส่งคำขอนี้ไปยังเซิร์ฟเวอร์เพื่อทำงานเหล่านี้ให้เสร็จสิ้น
การผูกข้อมูลในแบบจำลอง OData เป็นวิธีหนึ่ง แต่คุณสามารถเปิดใช้งานการเชื่อมสองทางโดยใช้การสนับสนุนการเขียนทดลอง
คุณสมบัติที่สำคัญ ได้แก่ -
- รูปแบบการผูกข้อมูล OData รองรับข้อมูลที่สอดคล้องกับ Odata
- โมเดลข้อมูลนี้ช่วยให้คุณสร้างคำขอ OData และจัดการการตอบสนอง
- สนับสนุนการผูกสองทางแบบทดลอง
Creating a model instance −
Var oModel = new sap.ui.model.odata.ODataModel (dataUrl [,useJSON, user, pass]);
การกำหนด Model
คุณสามารถใช้เมธอด setModel เพื่อกำหนดโมเดลให้กับคอนโทรลหรือคอร์เฉพาะ
Sap.ui.getcore().setModel(oModel);
ในการผูกโมเดลเพื่อดู -
Var myView = sap.ui.view({type:sap.ui.core.mvc.ViewType.JS, viewname:”view name”});
myView.setModel(oModel);
ในการผูกโมเดลเข้ากับคอนโทรล -
Var oTable = sap.ui.getCore().byId(“table”);
oTable.setModel(oModel);
คุณสามารถผูกคุณสมบัติของตัวควบคุมกับคุณสมบัติโมเดล คุณสามารถผูกคุณสมบัติของโมเดลเข้ากับคอนโทรลโดยใช้เมธอด bindproperty -
oControl.bindProperty(“controlProperty”, “modelProperty”);
or by using below methodvar
oControl = new sap.ui.commons.TextView({
controlProperty: “{modelProperty}”
});
การรวมการรวม
คุณสามารถใช้การรวมการรวมเพื่อผูกคอลเลกชันของค่าเช่นการผูกหลายแถวกับตาราง ในการใช้การรวมคุณต้องใช้ตัวควบคุมที่ทำหน้าที่เป็นเทมเพลต
คุณสามารถกำหนดการรวมการรวมโดยใช้เมธอด bindAgregation
oComboBox.bindaggregation( “items”, “/modelaggregation”, oItemTemplate);