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);