Yannick Ruppert
17. September 2020

SAPUI5 Data Binding – Binding Modes und Binding Types

SAPUI5

Binding Modes und Binding Types bei SAPUI5? Was soll das eigentlich sein? In Vorbereitung auf die C_FIORDEV_21-Zertifizierung habe ich mir dazu eine Übersicht erstellt und möchte diese hier mit Ihnen teilen.

Die Begriffe

Binding Mode

Der Binding Mode legt fest, wie die Daten aus dem Model an die View gebunden werden und bei welchen Aktionen die Daten aktualisiert werden können. Hier werden Sie auf die Begriffe „One Way“, „Two Way“ und „One Time“ stoßen. Der Binding Mode wird üblicherweise pro Model festgelegt und nur für einzelne Controls übersteuert.

Binding Type

Der Binding Type legt fest, welche Daten beim Binding an welche Eigenschaft des Controls gebunden werden. Hier werden Sie wiederum auf die Begriffe „Property Binding“, „Expression Binding“, „Context/Element Binding“ und „Aggregation Binding“ stoßen. Der Binding Type wird pro Binding an ein Control festgelegt.

Was unterscheidet die unterschiedlichen Binding Modes?

One Way Binding

Die Daten aus dem Model werden an die View gebunden. Updaten Sie die Daten im Model, wird die View entsprechend ebenfalls aktualisiert.

Two Way Binding

Die Daten aus dem Model werden an die View gebunden. Außerdem wird auch die View ans Model gebunden, so dass Aktualisierungen von Daten im Model die View aktualisieren, während bei der Aktualisierung von Daten im View das Model aktualisiert wird.

Unsere FAQs zum Thema SAPUI5 SAP Fiori

FAQ: SAPUI5 SAP Fiori

Die häufigsten Fragen zum Themenkomplex SAPUI5 & SAP Fiori.

One Time

Beim One Time Binding werden die Daten einmalig aus dem Model an die View gebunden. Aktualisierungen in der View haben keinerlei Auswirkungen auf das Model und umgekehrt.

Für unterschiedliche Anwendungsfälle benötigen Sie die unterschiedlichen Binding Modes. Ein klassisches Beispiel für das OneTime Binding ist das Resource Model, da hier mit statischen Texten gearbeitet wird. Die unterschiedlichen Models unterstützen die Binding Modes wie folgt:

UI5 Binding Modes

UI5 Binding Modes

Was unterscheidet die unterschiedlichen Binding Types?

Property Binding

Beim Property Binding wird eine Eigenschaft eines Controls durch das Binding befüllt und gegebenenfalls geupdatet (je nach Binding Mode). Ein einfaches Beispiel wäre also die Anzeige der Anzahl eines Urlaubskontingents auf Basis der Daten aus dem Model. Es besteht außerdem die Möglichkeit, Formatter zu verwenden. So beispielsweise dann, wenn die Daten zwar im Model stehen, aber für die Anzeige anders formatiert werden sollen, als sie im Model stehen. Die Syntax für unterschiedliche Models können Sie hier nachlesen.

Für komplexere Bindings können Sie das Expression Binding verwenden. Dies bietet Ihnen die Möglichkeit, ohne separates JavaScript Coding (Formatter) viele Anwendungsfälle in XML abzufangen. Ein Beispiel wäre das Ein- oder Ausblenden eines Controls, wenn ein Wert im Model einen bestimmten Wert hat. Eine sehr gute Erklärung der SAP mit der zur Verfügung stehenden Syntax finden Sie hier.

Context/ Element Binding

Beim Element Binding wird ein Element aus dem Model an ein Control gebunden. Haben wir beim Property Binding also beispielsweise die Anzahl eines Urlaubskontingentes verwendet, so können wir mit dem Element Binding das ganze Objekt des Kontingents mit allen zugehörigen Werten an ein Control binden. Daher wird diese Art des Bindings häufig in Master Detail Applikationen verwendet, um die Detailinformationen einen bestimmten Elements anzuzeigen. Die zugehörige Syntax mit Beispielen finden Sie hier.

Aggregation Binding

Aggregation Binding können Sie, wie der Name verrät, verwenden, um eine Aggregation zu binden. Leicht verständlich wird dies beispielsweise bei dem folgenden Anwendungsfall: Sie haben im Model eine Liste verschiedener Kontingente mit der entsprechender Anzahl, Texten etc. Um diese Liste jetzt anzuzeigen, können Sie ein Aggregation Binding an die Aggregation „items“ einer Tabelle in der View binden. Daraufhin werden entsprechende Zeilen der Tabelle für jedes Element generiert, die an den entsprechenden Eintrag aus dem Model gebunden sind. Weitere Informationen finden Sie hier.

Weitere Fragen?

Wenn bei Ihnen Fragen offen geblieben sind oder Sie Interesse an einer Schulung zum Thema UI5 mit diesen und weiteren Themen haben, melden Sie sich gerne!

Erfahren Sie hier mehr zu der C_FIORDEV_21-Zertifizierung.

Yannick Ruppert

Yannick Ruppert

Als zertifizierter SAP Consultant bei der mindsquare ist mein höchstes Ziel die Zufriedenheit meiner Kunden mit unseren Beratungs- und Entwicklungsleistungen. Dabei freue ich mich auf spannende und abwechslungsreiche Projekte im HCM-Modul.

Sie haben Fragen? Kontaktieren Sie mich!



Das könnte Sie auch interessieren

Kennen Sie das? Sie entwickeln eine eigene SAPUI5/Fiori App und im Backend tritt ein Fehler auf. Falls Sie diesen nicht behandeln und propagieren, erhalten Sie in Ihrer Anwendung oft dieses Bild: Wenn Sie wissen möchten, wie Sie auf die unterschiedlichsten […]

weiterlesen

Nachdem der OData Service in der Transaktion SEGW angelegt und im Gateway Client ausführlich getestet wurde, verlassen Sie endgültig die vertraute SAP Backend Umgebung. Jetzt kommt es darauf an, den Service auch entsprechend aus dem Frontend nutzen zu können.

weiterlesen

Viele Unternehmen und speziell die HR-Abteilungen befassen sich zur Zeit mit dem Thema Kurzarbeit. Durch das Corona-Virus (COVID-19) wechseln viele Organisationen in den Krisenmodus. Die wirtschaftlichen Folgen kann aktuell niemand seriös bewerten. Durch Auftragseinbußen und schlechte wirtschaftliche Aussichten in Folge […]

weiterlesen

Schreiben Sie einen Kommentar

Bitte füllen Sie alle mit * gekennzeichneten Felder aus. Ihre E-Mail Adresse wird nicht veröffentlicht.





Angebot anfordern
Preisliste herunterladen
Expert Session
Support