SAP Kurs | SAP Schulung | Österreich und Deutschland

SAP Kurs | SAP Schulung | Österreich und Deutschland

SAP Kurse und SAP Weiterbildung

Wissensaufbau und Weiterbildung sind wichtig! Möchtet ihr euch zum Thema SAP Cloud weiterbilden oder SAP Fiori und SAPUI5 lernen? Unsere Kurse sind im offiziellen SAP-Schulungskatalog zu finden. Sei virtuell oder vor Ort im Schulungszentrum mit dabei!

SAP Schulungen

SAPUI5, SAP Fiori, SAP Cloud Integration und SAP Cloud Security waren dabei die wichtigsten Themen. Daraus haben wir praxisrelevante Trainings entwickelt. Unser Motto lautet „Von Experten für Experten“.  Mit unseren Trainings haben wir auch die SAP überzeugt und es damit geschafft in den offiziellen SAP Schulungskatalog aufgenommen zu werden. Die Trainings werden organisatorisch und kommerziell von SAP abgewickelt. Unser Anspruch an uns selbst lautet mit „Top Experten und aktuellen Themen“ Kunden überzeugen. Wir stellen die Trainer und aktualisieren laufend unsere Trainings. Unsere Trainer gehören zu den weltweit am besten bewerteten. Vor und nach jedem Training werden die Unterlagen aktualisiert. Unser Kurse finden in Österreich und Deutschland statt sowie aus dem online LIVE Classroom. Folgende Kurse sind für sie  daraus entstanden:

Wie buche ich mein  SAP® Kurs? 📘

Wenn Sie nun den einen Kurs buchen wollen, gehen Sie auf die SAP Homepage. Melden sie sich bitte am System an, danach wählen Sie Österreich und Deutschland aus um die gesamte Auswahl an buchbaren Kursen zu sehen.   Es wurden typischerweise kurze SAP Kurstitel entwickelt: Für  den SAP® UI5 Kurs tippen sie HOUI5, um auf das  SAP® FIORI Kurs zu gelangen tippen sie HOFIO ein. Ausserdem haben wir in unseren SAP® Kurs noch die SAP® Cloud Platform Security mit dem Kürzel WDECPS im Sortiment. Interessiert Sie das Thema SAP Cloud Platform Integration so tippen WDEI1 ein. Wenn Ihre Kursorte erscheinen können Sie auch über den online Live Classroom mit dabei sein. Wir haben hier für sie alle momentanen Kurse und Trainings zusammengefasst. Unser CloudDNA Team freut sich wenn Sie mit dabei sind  und macht Sie fit für ihr SAP Business.

SAP® Kurs HOUI5

Hands-on Foundation zur Entwicklung von SAPUI5 Applikationen

    SAP® Kurs Fiori HOFIO

    *27 September 2021 – 1 Oktober 2021

    Hands-on Deep Dive zur Entwicklung von SAP Fiori Oberflächen

    2021 SAP® Kurs WDEI1

    SAP Cloud Platform Integration – Eine praxisnahe Einführung in Entwicklung und Architektur

     2021 SAP® Kurs WDECPS

     SAP® Cloud Platform Security Eine ganzheitliche Betrachtung

      F&A

      Welcher SAP Fiori Kurs ist momentan zu buchen?

      Im Moment bieten wir Hands-on Deep Dive zur Entwicklung von SAP Fiori Oberflächen- Kurstitel HOFIO an, ausserdem Hands-on Foundation zur Entwicklung von SAPUI5 Applikationen- Kurstitel HOUI5

      Welchen SAP Cloud Platform Kurs bietet Ihr zur Zeit an?

      SAP Cloud Platform Integration – Eine praxisnahe Einführung in Entwicklung und Architektur- Kurstitel WDEI1 ausserdem Cloud Platform Security – Eine ganzheitliche Betrachtung-Kurstitel WDECPS

      Welche Vorteile bieten SAP Kurse vom Team der CloudDNA

      Wir bieten 90% Hands on Training von Experten für Experten, aus der Praxis für die Praxis. Unsere Trainer haben selbst die kompletten Trainings ausgearbeitet und können somit alle Fragen mit Präzision beantworten

      Wir freuen uns auf die kommenden Kurse und Trainings im Sommer und Winter 2021

      Möchten Sie mehr über unsere Consulting Packages erfahren : SAP Cloud Connector Setup, SAP CPI OnBoarding, SAP Fiori Quickstart, klicken sie bitte auf den Button:

      Folgen Sie unserem Youtube Channel um keine Neuigkeiten zu verpassen. Wir veröffentlich in regelmässigen Intervallen Videos zur SAP Cloud Platform.

      SAP Trainer Zertifikat 2021 Training Kurs Consultant Clouddna beratung Deutschland Österreich und Schweiz WDECPS WDEI1 HOFIO HOUI5 Fiori Cloud platform Plattform Security Trainer

      CloudDNA Expert Talks zum SAP Cloud Connector

      Sehen Sie sich auch unsere anderen Expert Talks zum SAP Cloud Connector an:

      Grundlagen des SAP Cloud Connector

      Mit Fragen zum SAP Cloud Connector, zur SAP BTP, zur SAP Cloud Platform, zur SAP CPI, zur SAP Integration Suite und anderen innovativen Themen sind Sie bei uns genau an der richtigen Adresse! Haben Sie Fragen zu unseren Leistungen, Paketen oder Produkten? Kontaktieren Sie uns!

      Ihre Nachricht an die CloudDNA:

      SAP Training | Lerne SAP Fiori| SAPUI5 |SAP Cloud Platform und Security

      SAP Training | Lerne SAP Fiori| SAPUI5 |SAP Cloud Platform und Security

      SAP® TRAININGS der CloudDNA sind im offiziellen SAP Schulungskatalog zu finden!

      Als die Anfrage kam, ob das Team der CloudDNA auch ein SAP Training über SAP Fiori, SAPUI5, SAP Cloud Platform Security und SAP Cloud Platform Integration entwickeln will. Haben wir uns für sie schnellmöglich an die Ausarbeitung der Kursinhalte gemacht. Aus den letzen Jahren haben wir die Anforderungen aus allen Projekten zusammengetragen. Wir haben mit Kunden gesprochen und ihre Anforderungen erhoben. Ausserdem haben wir für Sie auf das Feedback in Trainings, Schulungen und Lehrgängen gehört.

      SAPUI5, SAP Fiori, SAP Cloud Integration und SAP Cloud Security waren dabei die wichtigsten Themen. Daraus haben wir praxisrelevante Trainings entwickelt. Unser Motto lautet „Von Experten für Experten“.  Mit unseren Trainings haben wir auch die SAP überzeugt und es damit geschafft in den offiziellen SAP Schulungskatalog aufgenommen zu werden. Die Trainings werden organisatorisch und kommerziell von SAP abgewickelt. Unser Anspruch an uns selbst lautet mit „Top Experten und aktuellen Themen“ Kunden überzeugen. Wir stellen die Trainer und aktualisieren laufend unsere Trainings. Unsere Trainer gehören zu den weltweit am besten bewerteten. Vor und nach jedem Training werden die Unterlagen aktualisiert. Unser Kurse finden in Österreich und Deutschland statt sowie aus dem online LIVE Classroom. Folgende Kurse sind für sie  daraus entstanden:

      Wie buche ich mein  SAP® Training? 📘

      Wenn Sie nun den einen Kurs buchen wollen, gehen Sie auf die SAP Homepage. Melden sie sich bitte am System an, danach wählen Sie Österreich und Deutschland aus um die gesamte Auswahl an buchbaren Kursen zu sehen.   Es wurden typischerweise kurze SAP Kurstitel entwickelt: Für  den SAP® UI5 Kurs tippen sie HOUI5, um auf das  SAP® FIORI Training zu gelangen tippen sie HOFIO ein. Ausserdem haben wir in unseren SAP® Trainings noch die SAP® Cloud Platform Security mit dem Kürzel WDECPS im Sortiment. Interessiert Sie das Thema SAP Cloud Platform Integration so tippen WDEI1 ein. Wenn Ihre Kursorte erscheinen können Sie auch über den online Live Classroom mit dabei sein. Wir haben hier für sie alle momentanen Kurse und Trainings zusammengefasst. Unser CloudDNA Team freut sich wenn Sie mit dabei sind  und macht Sie fit für ihr SAP Business.

      2021 SAP® Training HOUI5

      22. November 2021 – 26. November 2021

      Hands-on Foundation zur Entwicklung von SAPUI5 Applikationen

      Unser Kursinhalt:

      • Um die Prinzipien von SAPUI5 zu verstehen,  erklären wir es Ihnen an einigen durchgängigen Beispiel aus der Praxis für die Praxis.
      • Sie lernen das Implementieren von SAPUI5 Applikationen.
      • Trotz der Komplexitiät von SapUI5, werden sie nach dem Kurs die Konzepte und Umsetzung von komplexen SAPUI5 Applikationen verstehen. Wir bieten 90% Hands on Training für Sie!
      • Wie können sie effizient und zielgerichtet mit der offiziellen SAPUI5 Dokumentation arbeiten?

      2021 SAP® Training HOFIO

      27. September 2021 – 1. Oktober 2021

      Hands-on Deep Dive zur Entwicklung von SAP Fiori Oberflächen

      Unser Kursinhalt:

      • Sie möchten die Prinzipien von SAP Fiori verstehen? Wir erklären es Ihnen an einem durchgängigen Beispiel, aus der Praxis für die Praxis.
      • Nach dem Kurs können Sie SAP Fiori Oberflächen implementieren.
      • Das Verstehen und praxisnahes Anwenden der fortgeschrittenen SAP Fiori Konzepte. Wir bieten Ihnen  90% Hands-on Training
      • Sie lernen effizientes und zielgerichtetes Arbeiten, um mit der SAPUI5 Dokumentation unter Berücksichtigung der SAP Fiori Design Guidelines richtig werken zu können

      2021 SAP® Training WDEI1
      8. November- 12. November 2021

      SAP Cloud Platform Integration – Eine praxisnahe Einführung in Entwicklung und Architektur

      Unser Kursinhalt:

      • Wir betrachten die praxisnahen Aspekte in Cloud Integration Projekten um sie zu verstehen.
      • Unsere Inhalte sind gekennzeichnet durch hohe praktische Erfahrungen. Wie bieten für Sie auch hier ein Hands- on Training
      • Ausserdem gehört SOAP, HTTPS, REST, OData, SFTP, Mail, XI, ABAP Proxy, ESR, SAP PO natürlich auch dazu.

      2021 SAP® Training WDECPS

      11. Oktober 2021 – 14. Oktober 2021

      SAP® Cloud Platform Security Eine ganzheitliche Betrachtung

      Unser Kursinhalt:

      • Wir betrachten gemeinsam die SAP Cloud Platform Security, nach dem Kurs werden sie alle technischen Grundlagen die wichtig sind verstehen
      • Sie werden die aktuellsten Szenarien, sowohl im Neo als auch Cloud Foundry Stack verstehen.
      • Unsere Inhalte sind für sie gekennzeichnet  und durch hohe praxisrelevante Erfahrungen besonders interessant . Wir bieten auch hier ein Hands-on Training

        F&A

        Welches SAP Fiori Training ist momentan zu buchen?

        Im Moment bieten wir Hands-on Deep Dive zur Entwicklung von SAP Fiori Oberflächen- Kurstitel HOFIO an, ausserdem Hands-on Foundation zur Entwicklung von SAPUI5 Applikationen- Kurstitel HOUI5

        Welches SAP Cloud Platform Training bietet Ihr zur Zeit an?

        SAP Cloud Platform Integration – Eine praxisnahe Einführung in Entwicklung und Architektur- Kurstitel WDEI1 ausserdem Cloud Platform Security – Eine ganzheitliche Betrachtung-Kurstitel WDECPS

        Welche Vorteile bieten SAP Trainings vom Team der CloudDNA

        Wir bieten 90% Hands on Training von Experten für Experten, aus der Praxis für die Praxis. Unsere Trainer haben selbst die kompletten Trainings ausgearbeitet und können somit alle Fragen mit Präzision beantworten

        Wir freuen uns auf die kommenden Kurse und Trainings im Sommer und Winter 2021

        Möchten Sie mehr über unsere Consulting Packages erfahren : SAP Cloud Connector Setup, SAP CPI OnBoarding, SAP Fiori Quickstart, klicken sie bitte auf den Button:

        Folgen Sie unserem Youtube Channel um keine Neuigkeiten zu verpassen. Wir veröffentlich in regelmässigen Intervallen Videos zur SAP Cloud Platform.

        SAP Trainer Zertifikat 2021 Training Kurs Consultant Clouddna beratung Deutschland Österreich und Schweiz WDECPS WDEI1 HOFIO HOUI5 Fiori Cloud platform Plattform Security Trainer

        CloudDNA Expert Talks zum SAP Cloud Connector

        Sehen Sie sich auch unsere anderen Expert Talks zum SAP Cloud Connector an:

        Grundlagen des SAP Cloud Connector

        Mit Fragen zum SAP Cloud Connector, zur SAP BTP, zur SAP Cloud Platform, zur SAP CPI, zur SAP Integration Suite und anderen innovativen Themen sind Sie bei uns genau an der richtigen Adresse! Haben Sie Fragen zu unseren Leistungen, Paketen oder Produkten? Kontaktieren Sie uns!

        Ihre Nachricht an die CloudDNA:

        SAPUI5 Custom Controls – Teil 2

        SAPUI5 Custom Controls – Teil 2

        SAPUI5 Custom Control Teil 2

        Der Weg zum eigenen Control

        Da wir nun im letzten Teil alles über den generellen Aufbau eines SAPUI5 Custom Controls gelernt haben, möchten wir das ganze in der Praxis anwenden.

         

        Wie lege ich im SAPUI5 Custom Control eine Liste von Personen?

        Unsere Aufgabenstellung ist folgende:

        Wir möchten einen Weg finden, um eine Liste von Personen gemäß hypothetischen Firmen-Design-Guidelines darzustellen. Leider reicht das UI5 Framework für die angenommene Einschränkung nicht aus.

        Daher benötigen wir ein Custom Control. Genauer gesagt, benötigen wir folgende Komponenten:

        • PersonList – Darstellung unserer Liste
        • PersonListItem – Eine einzelne Zeile
        • style.css – Custom Styling

        Optional können noch folgende Files angelegt werden:

        • PersonListRenderer – Zum ausgelagerten Rendern der Liste
        • PersonListItemRenderer – Zum ausgelagterten Rendern eines Items

        PersonListItem im SAPUI5 Custom Control

        Wir arbeiten uns von unten nach oben. D.h. wir fangen mit unserem aggregierten Control an, welches eben das einzelne Listitem wäre.

        Ausgeben möchten wir Vorname, Nachname und das Alter der Person. Um noch ein Custom-CSS reinzubekommen, werden wir Personen mit einem Alter geringer als 18 anders formattieren.

        Erstellen wir zunächst ein neues UI5 Projekt und legen die Files für die Custom-Controls an.

        Anschließend definieren wir ein Template für das PersonListItem:

        Wir wissen, dass wir mit sap.ui.define ein neues Modul anlegen, das zur Laufzeit dynamisch von unserem UI5 Framework geladen wird. Und genau so definieren wir eben auch ein Custom Control. Dieses inkludiert das sap.ui.core.Control, welches wir per .extend erweitern und zurückliefern.

        Unsere PersonListItem soll 3 verschiedene Personaleigenschaften ausgeben. Daher brauchen wir 3 Properties (Vorname, Nachname, Alter).

        Aggregations soll unser PersonListItem nicht haben, denn wir möchten das PersonListItem selbst als zu aggregierendes Control verwenden.

        Properties anlegen

        Wir benötigen 3 Properties:

        • firstName: string
        • lastName: string
        • age: int

        Auf die Properties kann per get<PropertyName>() zugegriffen werden.

         

        Events anlegen

        Wir möchten, dass bei einem Click auf das PersonListItem ein Event ausgeführt wird. Dieses liefert eine Hallo-Message zurück.

        • sayHello
          • parameter: message(string)

        Anschließend definieren wir eine Eventhandler für das HTML-onclick-Event. Falls dieses auftritt, triggern wir das sayHello-Event und liefern eine Message bestehend aus Name und „says hello“ per message-Parameter zurück.

         

        CSS Styling

        Wir möchten unsere 3 Properties per HTML-ul-Element anzeigen. Da ist jedoch das Problem, dass die Liste standartmäßig untereinander ihre Items anordnet. Um das zu umgehen, sagen wir per CSS-Klasssenselektor, das alle li-Elemente unter der Klasse die CSS-Property display mit dem Wert inline bekommen.

        Und zusätzlich definieren wir noch ein padding von 10 Pixel und die Schriftfarbe black;

         

        Renderer

        Der Renderer ist das Herzstück unseres Controls. Hier wird definiert, was wann und wie in das DOM eingtragen werden soll.

        Die wichtigsten Renderer-Funktionen sind dem letzten Blog-Teil zu entnehmen.

        Wir möchten unser Control als div-Element und einer ul ausgeben. Zusätzlich möchten wir noch das Alter dementsprechend farblich hervorheben, basierend auf dem Kriterium, dass das Alter > 18 ist.

        1: div ausgeben

        Zu aller erst erstellen wir per openStart ein öffnendes div-Tag. Dieses div-Tag wird per writeControlData die Control-Referenz geschrieben und anschließend fügen wir noch unsere CSS-Klasse hinzu. Dann wird das öffnende div-Tag mit > geschlossen.

        2: Liste aufbauen

        Wir erstellen eine neue unordered-list. Als erstes List-Item geben wir den Vornamen der Person aus und dann den Nachnamen.

        3: Alter ausgeben

        Je nach dem ob die Person ein Alter > 18 hat, erstellen wir ein List-Item mit dem Style colorred oder color: green.

        4: Alles schließen

        Zu letzt schließen wir die Liste und abschließend das div-Tag.

         

        Somit ist unser PersonListItem komplett. Im nächsten Schritt werden wir nun die PersonList definieren und unser PersonListItem aggregieren.

        PersonList im SAPUI5 Custom Control

        Die PersonList soll einen Titel bekommen und unsere Personen per PersonListItem anzeigen.

        Hierfür benötigen wir Properties und Aggregations.

        Metadata definieren

        Wir benötigen folgende Property für unseren Titel:

        • title (string) – default: Persons

        Zusätzlich möchten wir noch PersonListItems aggregieren:

        • items (PersonListItem) – multiple: true

        CSS Styling

        per list-style: none sagen wir, dass unsere Personenliste keine Aufzählungszeichen haben sollte.

        Dann selektieren wir alle Items mit einem ungeraden Index und färben diese grau ein.

        Zusätzlich geben wir noch ein seitliches margin von 15 Pixel.

        Renderer definieren

        In unserem Renderer wollen wir den Titel der Personenliste und aggregiert die PersonListItems ausgeben.

        1: div öffnen

        Gleich wie beim PersonListItem öffnen wir einen div-Container und vergeben CSS-Klasse und Control-Data.

        2: Titel ausgeben

        Der Titel wird innerhalb eines h2-Tags ausgebeben.

        3: Items-Aggregation rendern

        Per getAggregation(„items“) können wir uns den Inhalt der Items-Aggregation in einem Array speichern. Dieses Array laufen wir durch und erstellen für jeden Eintrag ein neues li-Tag mit der myPersonListItemSelector-Klasse. Dieses bekommt ihren Inhalt per renderControl()-Funktion, welche die render-Methode des übergebenen Controls aufruft. In unserem Fall ist das das PersonListItem.

        4: alles schließen

         Abschließend fügen wir noch die schließenden ul- und div-Tags hinzu.

        Jetzt sind unsere Custom-Controls fertig und können in den Views verwendet werden.

        Controls verwenden

        Die beiden Custom Controls können nun in unserer View verwendet werden.

        1: Namespace einbinden

        Um Controls aus einem anderen Namensraum einzubinden, muss für diesen ein Alias angelegt werden. Wir verweisen hier auf unseren Folder, wo wir die Controls angelegt haben.

        2: PersonList einfügen

        Wir legen eine neue PersonList an. Dort vergeben wir die title-Property und legen eine items-Aggregation an.

        3: PersonListItems hinzufügen

        In der items-Aggregation legen wir nun mehrere PersonListItems an. Das würde natürlich auch über Aggregation-Binding in der PersonList per Model funktionieren.

        Wir legen aber z.B. 3 PersonListItems an und vergeben allen Properties Werte. Zusätzlich definieren wir eine Funktion für unser sayHello-Event.

        Dieses müssen wir dann noch im zugehörigen Controller ausprogrammieren.

        Also definieren wir eine neue Methode namens onSayHelloHandler, wo wir den Eventparameter message auslesen und per alert anzeigen.

        App ausführen

        Unsere App ist nun funktionsfähig und zeig unsere Custom-Controls richtig an.

        Wir sehen nun unseren Titel und 3 darunterliegende Personen, die farblich abwechselnd hinterlegt sind.

        Zusammenfassung

        In 2 Blogteilen haben wir nun alles Notwendige gelernt, um mit dem Entwickeln von eigenen Custom-Controls durchzustarte, falls die Anforderungen nicht durch das umfangreiche SAPUI5 Controls-Paket abgedeckt wird.

        Eine weitere Vorgehensweise könnte sein, meine eigenen Custom-Controls in eine UI5-Library/Git Repo zu packen und zu deployen. Dann kann ich diese in weiteren Applikationen verwenden und kann mir meine eigene, umfangreiche Library bauen.

        Nur sollte man nicht für jede Anforderung ein neues Control entwickeln oder ein bestehendes zu erweitern. Man sollte so gut und so weit wie möglich mit dem arbeiten, was einem das SAPUI5 Framework zur Verfügung stellt und sich so weit wie möglich in die Materie einarbeiten.

        Wer also gerne mehr bezüglich UI5 wissen möchte, kann sich gerne unseren zahlreichen Blogs bedienen.

        Die interessantesten für das Controls-Thema sind:

        Vielen Dank für das Lesen dieser Blogreihe und wenn Fragen auftreten, können sie gerne in den Kommentaren gestellt werden.

        Data Binding in SAPUI5

        Data Binding in SAPUI5

        Übersicht

        In diesem Blog werden wir uns mit Data Binding in SAPUI5, Open UI5 und SAP Fiori Apps beschäftigen.

        Die Inhalte werden in unseren SAP Trainings bis ins kleinste Detail behandelt. Diese Trainings laufen unter den Titeln HOUI5 und HOFIO und werden bei SAP im offiziellen Schulungskatalog für Deutschland, Österreich und der Schweiz gelistet.

        Inhalt

        In diesem Blog zeigen wir Ihnen folgende Themen: 

        • Grundlegendes zum Data Binding
        • Databinding Modi
          • One-Time-Binding
          • One-Way-Binding
          • Two-Way-Binding
        • Arten von Databindings
          • Property Binding
          • Aggregation Binding
          • Element Binding
        • Databinding Syntax
          • Binding Pfad
          • Composite Binding
          • Expression Binding
          • Metadata Binding

        Grundlegendes zum Data Binding in SAPUI5

        In SAPUI5 und OpenUI5 können Sie das Data Binding einsetzen, um Daten aus dem Model unter Verwendung von UI-Controls darzustellen. Das ermöglicht Ihnen auch das Aktualisieren und Editieren der Daten direkt im User Interface, dadurch verknüpfen Sie das User Interface mit dem Model.

        Hierfür benötigen Sie folgende zwei Dinge:

        • Ein Data Model (JSON, OData)
        • Eine Bindinginstanz

        Als Data Model verwenden Sie üblicherweise ein JSON- oder ein OData-Model. Das Model hält für Sie die Daten vor und bietet Ihnen Methoden an , um mit dem Server zu kommunizieren. Zusätzlich bietet es Ihnen Möglichkeiten, um Data Bindings programmatisch zu erstellen. Wenn Sie die Methode aufrufen sorgt es dafür, dass eine Binding Instanz für Sie erstellt wird. Die Instanz beinhaltet Informationen zum Binding sowie bestimmte Events. Ein spezieller Event wird getriggert, wenn sich die gebundenen Daten ändern.

        Welche Data Binding Modi im SAPUI5 gibt es?

        Durch die Enumeration „sap.ui.model.BindingMode“ werden Ihnen drei verschiedene Data Binding Modi bereitgestellt. Diese können Sie unter Verwendung der Methode „.setDefaultBindingMode(bindingMode)“ allgemein auf ein Model anwenden. Optional können Sie es über das Property „oBindingInfo.mode“ auch auf einzelne Binding Instanzen verwenden.

        One-Time-Binding – sap.ui.model.BindingMode.OneTime

        Setzen Sie den BindingMode auf „OneTime“, werden die Daten einmalig vom Model gelesen. Ausserdem können Sie nicht manipuliert werden.

        One-Way-Binding – sap.ui.model.BindingMode.OneWay

        “OneWay”-Binding bedeutet, dass die Daten vom Model gelesen und an die View gebunden werden. Die Daten können Sie in der View zwar manipulieren, aber leider können Sie die Änderungen nicht zurück ins Model übertragen. Dieser Binding Modus war für das JSON-Model lange Zeit das Standardverhalten.

        Two-Way-Binding – sap.ui.model.BindingMode.TwoWay

        Möchten Sie in der View Daten manipulieren und die Änderungen automatisch in das Model übernehmen? Dann ist der Binding Mode „TwoWay“ genau das Richtige für Sie. Im Gegensatz zum One-Way-Binding können Sie Daten vom Model zur View und umgekehrt übertragen.

        Arten von Data Bindings in SAPUI5 und OpenUI5

        In SAPUI5 und OpenUI5 gibt es drei unterschiedliche Arten von Data Bindings. Wie sie damit am arbeiten, führen wir im Folgenden Beitrag für Sie näher aus. Im Data Binding müssen Sie immer einen Bindingpfad angeben. Diesen sollen Sie durch ‚{}‘ kennzeichnen

        Je nachdem, ob Sie das Default-Model oder ein Named-Model verwenden, unterscheidet sich dieser Pfad geringfügig.  Wenn Sie ein  Named-Models verwenden wollen, müssen dem Namen der Property noch ein ‚modelName>‘ voranstellen.

        Möchten Sie die Eigenschaft „FirstName“ auf die value-Eigenschaft eines Inputs binden (Property Binding), sieht das, bei der Verwendung eines Default-Models, wie folgt aus:

        Verwenden Sie hingegen ein Named-Model, müssen Sie der Eigenschaft der Modelname voranstellen:

        Property Binding

        Verwenden Sie ein Property Binding, um beispielsweise Daten in einem Formular zu binden. Hierfür müssen Sie in der entsprechenden Eigenschaft (z.B.: text, value, …) einen Binding-Pfad angeben.

        Am Propertynamen vorangestellten ‚/‘ erkenne Sie, dass es sich um einen absoluten Pfad handelt. Das bedeutet, das sich die Eigenschaft „FirstName“ auf der Root-Ebene des Default-Models befindet.

        Aggregation Binding

        Möchten Sie Listen auf ein UI-Control binden, kommt das Aggregation Binding zum Einsatz. Es wird meist in Listen und Tabellen verwendet, dabei müssen Sie auch ein Template angeben. Dieses wird für jedes Element in der Liste geklont. Innerhalb des Templates müssen Sie relative Pfade verwenden, da der Pfad des Aggregation Bindings bereits auf die entsprechende Liste verweisen. Anstelle eines Templates haben Sie auch die Option eine Factory-Function anzugeben. Die definiert, wie die einzelnen Einträge im User Interface dargestellt werden sollen.

        Default-Model

        Named-Model

        Element Binding

        Das Element Binding ermöglicht Ihnen das Binden einzelner Elemente einer Liste auf UI-Controls. Hierbei wird ein sogenannter Binding-Context erzeugt. Die Binding-Pfade müssen Sie immer relativ angeben.

        Dieses SAPUI5 Data Binding können Sie überwiegend in Master-Detail Fiori Apps einsetzen.

        Das Element-Binding können Sie auf folgende Arten umsetzen:

        • Aufrufen der Methode bindElement im Controller
        • Verwenden einer Binding-Property des Controls

        Data Binding Syntax

        Mit einem Binding-Pfad können Sie ein UI-Control auf die Daten des Models binden.  Wenn sie durch das definieren eines Pfades, erstellen Sie einen Binding-Context.

        Composite Binding

        Wenn Sie einen Formatter verwenden, ist es häufig der Fall, dass mehrere Werte an den Formatter übergeben werden müssen. Diese Anforderung können Sie mit einem Composite-Binding umsetzen. In der jeweiligen Eigenschaft (value, text, …) des UI-Control kann das parts-Array, eine Liste paths definieren.

        Welche Arten von Expression Binding gibt es ?

        Mithilfe des Expression-Binding können Sie simple Prüfungen – z.B.: Vergleich von Werten – direkt in der View zur Laufzeit durchführen. Dadurch ersparen Sie sich das Implementieren von zusätzlichen Formatter-Funktionen im Controller.

        Sie können das Expression-Binding auf 2 Arten umsetzen:

        • ‚{=expression}‘: Es wird ein One-Way-Binding verwendet. Sollten sich Werte im Model ändern, wird auch das Binding aktualisiert.
        • ‚{:=expression}‘: Es wird ein One-Time-Binding verwendet. Der Wert wird einmalig ermittelt und anschließend nicht mehr aktualisiert.

        Als expression können Sie beliebige Prüfungen implementieren. Dabei ist die Syntax ähnliche jener in Javascript, jedoch werden nicht alle JavaScript Expressions unterstützt. Innerhalb der Expression greifen Sie auf Modeldaten folgendermaßen zu: ‚${binding}‘ oder ‚%{binding}‘

        Eine Prüfung und entsprechende Anzeige verschiedener Werte sieht wie folgt aus:

        ${binding} VS %{binding}

        Verwenden Sie ‚${binding}‘ wird der Wert automatisch in den Typ der Eigenschaft des Controls konvertiert. Im Falle des Visible-Properties eines sap.m.Input Controls wäre dies der Typ ‚boolean‘. Wenn Sie nicht immer ist diese Konvertierung erwünschen, können Sie diese mit ‚%{binding}‘ umgehen. ‚%{binding}‘ ist eine Kurzform für ‚${path: ´binding´, targetType: ´any´}‘. Den targetType können Sie durch alle Typen, die sap.ui.model.odata.type bietet ersetzen.

        Metadata Binding

        Möchten Sie die Metadata-Eigenschaften wie sap:label, sap:createable, sap:updatable, … in der View abfragen, können Sie dies mit einem Metadata-Binding erreichen.

        Auch hier können Sie zwei Ansätze verwenden.

        Absolute Bindings

        Absolute Bindings sehen folgendermaßen aus:

        /#EntityName/PropertyName/@Attribut

        Relative Bindings

        Nun zeige ich ihnen wie Relative Bindings aussehen:

        /EntitySetName/PropertyName/#@Attribut

        Best-Practice Beispiel zum Data Binding in SAPUI5 mit OData-Model und Two-Way-Binding

        Abschließend hab ich noch für Sie ein kurzes Best-Practice Beispiel vorbereitet. Wir schicken mit Hilfe eines OData-Models und Two-Way-Binding ein Update auf die Details eines Employees.

        Hier können sie folgende Methoden verwenden:

        • hasPendingChanges: Zum Abfragen, ob es Änderungen gibt
        • submitChanges: Mit ‚Save‘ werden Sie die Änderungen ans Backend schicken
        • resetChanges: Mit ‚Discard‘ werden Sie die Änderungen verwerfen

        View:

        Controller:

        Bei unserem Blog über Data Binding in SAPUi5 haben sie nun viele Informationen bekommen. Wenn sie an weiteren Themen interessiert sind, klicken sie hier unten auf GIT oder SAPUI5 Custom Controls. 

        Wollen Sie, dass  wir uns um Ihre Szenarien kümmern? Nehmen Sie gerne Kontakt auf den  klassische SAP Beratung und SAP Cloud Consulting liegt uns .Egal ob Deutschland, Schweiz oder Österreich – unser Team bestehend aus erfahrerenen Beratern und Entwicklern ist gerne für Sie da!

        Wir lassen sie nicht in der Cloud hängen den SAP ( Cloud ) Consulting liegt in unsere DNA

        Git Tutorial | Git Anleitung | Git Wissen | Git erklären Teil3

        Git Tutorial | Git Anleitung | Git Wissen | Git erklären Teil3

        Git Repository | Git Konflikte lösen

        Diese Git Tutorial macht dich zum Git Profi

        Lernen Sie mit diesem Git Tutorial wie GIT Repositories angelegt und in der SAP WebIDE verwendet werden. Wir erklären ihnen ausserdem mit dieser Git Anleitung wie Konflikte gelöst werden können.

        In der Blogreihe werden wir uns mit dem Thema Git beschäftigen und damit, warum das Arbeiten mit Git oder mit einem ähnlichen Tool für Entwickler fast schon unumgänglich ist.  Möchten Sie mehr über Git wissen oder haben Sie noch mehr Fragen zum Git Tutorial , nehmen sie gerne Kontakt auf.

        Die folgenden Informationen werden auch, jedoch um einiges ausführlicher, in unseren offiziell bei der SAP im Schulungskatalog gelisteten Kursen HOUI5, HOFIO und WDECPS behandelt.

        Besuchen Sie unsere SAP Standard Trainings

        Wir haben mit dem HOUI5 und dem HOFIO zwei 5-Tage-Trainings auf höchstem Niveau erstellt! Lernen Sie von uns die professionelle SAPUI5 und SAP Fiori Entwicklung!

        Inhalt des Git Tutorial

        Auf folgende Themen werden wir in unserer Blogreihe eingehen:

        • Einführung in die Welt von Git
        • Begrifflichkeiten und die wichtigsten Funktionen
        • SAPUI5-Entwicklung mit Hilfe von Git
          • Exkurs: LDAP-Anbindung und Git-Server-Anbindung an die SAP Cloud Platform

        Zielsetzung

        Unser Ziel ist es, dass man nach unserem Git Tutorial die unten stehende Grafik interpretieren und mit Git die SAPUI5-Entwicklung optimieren kann.

        Wichtig

        Seitdem GitHub die Namenskonventionen umgestellt hat, heißt der Strang, der automatisch angelegt wird, nicht mehr „master“ bzw. „origin/master“, sondern „main“ und „origin/main“. Da die SAP WebIDE diese Änderung noch nicht erkennt, muss man das entweder in der WebIDE mitgeben oder in GitHub übersteuern.

        Part 3 – Inhaltsverzeichnis Git Tutorial

        1. Repository anlegen (GitHub und SCP)
        2. Git Pane in der WebIDE + die wichtigsten Funktionen
        3. Conflict Handling

        Über den Autor

        Daniel Krancz

        Daniel Krancz

        SAP-Consultant / Software-Developer

        Ich bin SAP-Berater und -Entwickler im SAPUI5/Fiori- und OData-Umfeld. Seit 2019 bin ich offiziell als externer Trainer bei SAP gelistet und halte Kurse (UX, S4, …) über SAP-Webentwicklungen und Cloud-Implementierungen im In- und Ausland. Seit 2021 bin ich SAP Press Autor beim Rheinwerk Verlag im Bereich SAP Mobile.

        Einen letzten Punkt unseres Git Tutorial haben wir noch offen, nämlich die Verwendung von Git bei SAPUI5-Entwicklungen.

        SAPUI5-Entwicklung – Git Tutorial

        Ein jeder SAPUI5-Entwickler wird wahrscheinlich diesen Hinweis beim Importieren von bereits bestehenden SAPUI5-Apps aus dem ABAP-Repository schon mal gesehen haben:

        Auch wenn man sonst noch nie was von Git gehört hat, wird man spätestens an dieser Stelle merken, dass es fast unabdingbar mit Git die Sourcen zu verwalten.

        Aber wenn es um Git geht, stellt die SAP nicht nur diesen Hinweis zur Verfügung, sondern auch einen in die WebIDE integrierten Git Pane zur Verfügung.

        Wie lege ich ein Git Repository an?

        Für unser Beispiel werden wir zwei Git Repositories anlegen, nämlich einmal in GitHub und in der SAP Cloud Platform. Unser Beispielprojekt ist nachher nur mit dem GitHub Repository verknüpft. Im Lizenzmodell für die WebIDE sind auch die Git Repositories in der SAP Cloud Platform inkludiert.

        GitHub

        In GitHub können wir private Repositories anlegen, aber auch Repositories in Organisationen, in denen ich eingeladen worden bin.

        Man hat zurzeit zwei Varianten an Repositories:

        Public Repositories

        • für alle zugänglich, die den Link zur Repository haben
        • jeder kann clonen
        • Schreibrechte kann man einschränken (Push-Requests)

        Private Repositories

        • nur für Sie oder für die Organisation sichtbar (siehe Owner)
        • Innerhalb Ihrer Org. kann man eigene Teams verwalten, die je nach Rolle Lese- und Schreibrechte haben

        Zusätzlich sollte man noch einen README-File anlegen lassen, welche als Startseite für den Repository dient und dem User grundlegende Informationen vom Repo. anzeigen soll.

        Es besteht auch die Möglichkeit, bestimmte Files und Filetypen ignorieren und bekannte Lizenzmodelle hinzufügen zu lassen. (.gitignore)

        Nach dem Klick auf „Create repository“ wird man auch gleich in den Repository Browser geleitet:

        Auf alle einzelnen Möglichkeiten möchte ich hier nicht detailliert eingehen, weil diese Informationen eh schon überall im Internet zu finden sind.

        Kurz zusammengefasst:

        • man kann Lese- und Schreibrechte an bestimmte Personen und Teams vergeben
        • Commits und Pull-Requests verfolgen
        • Auswertungen ansehen
        • in den Einstellungen von Security bis Benachrichtigungen alles einstellen

        Was für uns in Zukunft jetzt wichtig ist, ist der Repository URL. Bei einem Clone müssen wir diese URL angeben, denn diese ist der Zeiger zu unserem Repository:

        https://github.com/clouddnagmbh/blogrepo

        SAP Cloud Platform

        Im Subaccount in der SCP (SAP Cloud Platform) hat man links im Menü die Möglichkeit Repositorys zu verwalten. Wenn Sie diesen Menüpunkt nicht sehen, dann fehlen Ihnen wahrscheinlich die nötigen Berechtigungen.

        Mit dem „New Repository“-Button können wir gleich einen Repository anlegen. Hier ist natürlich wichtig zu wissen, dass die Authentifizierung über die SCP erfolgt.

        Nachdem wir einen Namen und Beschreibung vergeben haben, können wir noch bestimmen, dass unser Repository mit einem initialen leeren Commit angelegt werden soll.

        Wenn wir die Details zu unserer Repository anschauen, dann können wir ein paar Informationen ablesen und direkt auch einige Funktionen ausführen.

        Es besteht die Möglichkeit, wieder den Namen zu editieren, unserem Repository nur Leserechte zu geben, den Garbage Collector zu starten, aber auch unser Repository direkt in die WebIDE clonen zu lassen.

        Zwei wichtige Links sieht man auch gleich, nämlich einen mit dem Zeiger auf unseren Repository (wichtig, wenn man clonen möchte) und einen für den Repository Browser (nichts anderes als ein Explorer).

        Was für uns in Zukunft jetzt wichtig ist, ist der Repository URL. Bei einem Clone müssen wir diese URL angeben, denn diese ist der Zeiger zu unserem Repository:

        https://git.eu2.hana.ondemand.com/<subaccount>/blogrepo

        Entwicklung- Git Tutorial

        In unserer WebIDE können wir an mehreren Stellen einen Git Repository clonen. Anbei eine Möglichkeit:

        Alle Varianten würden im Endeffekt zu diesem Wizard führen:

        Hier müssen wir unsere Repository URL einfügen. Zusätzlich könnte man eine Konfiguration für Gerrit, ein Review-System von Google, hinzufügen.

        Nach einer erfolgreichen Authentifizierung und Clone sehen wir die geclonte Applikation in unserem Workspace:

        Jedoch bringt uns das in unserem Fall noch nichts, weil unser Repository leer ist. Wir haben ja im zweiten Teil unserer Blogreihe gelernt, dass ein Entwickler der Erste sein muss, der quasi eine Rahmenapplikation deployed.

        Also lösche ich vorerst das geclonte Projekt, lege eine neue SAPUI5-App an und mit Rechtsklick auf das Projekt lege ich ein neues lokales Git Repository an:

        In einem Popup kann man den Benutzernamen und die Mailadresse hinterlegen, welche bei den Commits als Author eingetragen wird:

        Der Hinweis, dass das nicht mehr geändert werden kann, stimmt hier nicht ganz. Über Project -> Project Settings -> Git Repository kann das ganze geändert werden.

        Nach dem ich das lokale Git Repository angelegt habe, bekomme ich auch gleich die Information, dass ich einen Remote Repository anbinden soll:

        Das machen wir auch gleich und tragen unseren bereits erstellen Remote Repository ein:

        Da das Ganze im Grunde genommen nichts anderes ist, als das Zusammenführen von Local und Remote Repository, wird zuerst noch ein Fetch gemacht.

        Wir öffnen direkt den integrierten Git Pane:

        Nun können wir hier in einer grafischen Oberfläche verschiedene Funktionen ausführen:

        1. Wie wir im zweiten Teil unserer Blogreihe kennengelernt haben, könnte man hier auf die verschiedensten Funktionen (Fetch, Merge, Pull, …) zugreifen.
        2. Man sieht auf einem Blick um welchen Local Repository es sich handelt und man könnte neue Local Branches erstellen und zwischen diesen wechseln.
        3. Eine Liste der Änderungen seit dem letzten Commit

        Nocht nicht genug ? Weiter gehts ….

        4. Alle Änderungen, die sich im Staging Area befinden, werden auch beim nächsten Commit mitgenommen. Also wenn ich Änderungen habe, die ich noch nicht veröffentlichen will, dann werde ich diese aus der Staging Area rausnehmen und somit beim nächsten Commit nicht mit den anderen teilen.

        5. Jeder Commit erfordert eine Beschreibung, wie zum Beispiel eine kurze Zusammenfassung meiner Änderungen.

        6. Die Möglichkeit für Commit und Push findet man ganz unten.

        Symbole in der WebIDE

        Initial Commit and Push

        Wir haben einen Rahmenprojekt angelegt und sind der erste, der das Projekt auf den Remote Repository pusht:

        Nach einem erfolgreichen Push-Request können wir die Sourcen am Repository Browser ansehen:

        Nehmen wir jetzt an, dass wir diese Applikation nicht erstellt haben. Dann müssten wir genau an dieser Stelle einen Clone in unsere WebIDE vollziehen:

        Bei einem Clone erhält unser Projekt in der WebIDE den Namen vom Remote Repository. Gleich daneben steht auch, auf welchem lokalen Branch wir gerade arbeiten:

        Wie erstelle ich einen Local Branch im Git?

        Im Git Pane haben wir die Möglichkeit zu unserem standardmäßig erstellen „master“ Branch weitere Local Branches zu erstellen.

        Man wählt die Quelle aus (kann auch ein Remote Branch sein) und benennt den zu erstellenden lokalen Branch (in unserem Fall „featureA“):

        Nach dem Erstellen befinden wir uns auch schon direkt in dem Feature Branch. Sie können mit Hilfe des Drop-Downs auch wieder wechseln.

        In unserem Feature Branch machen wir ein paar Änderungen, legen neue Views an und fügen ein Label in die View ein. Wir beschreiben die Änderungen dementsprechend und committen sie:

        Nachdem wir mit unseren Feature Implementierungen fertig sind, möchten wir diese mit anderen Entwicklern teilen. Wir haben in unserem Git Pane einen Indikator, dass wir seit dem letzten Merge einen Commit gemacht haben:

        Nun wechseln wir in den lokalen „master“ Branch und machen einen Merge mit unserem Feature Branch. Wir verbinden die zwei Datenstände miteinander und prüfen auf eventuelle Konflikte:

        Nachdem der Merge (in unserem Fall) ohne Konflikte durchgelaufen ist, checken wir die Sourcen im „master“ Branch und sehen, dass die Änderungen aus unserem Feature Branch in unserem lokalen „master“ Branch gelandet sind:

        Wir hätten unseren Feature Branch natürlich auch gleich mit dem Remote Branch zusammenführen können, aber so konnten wir schonmal sichergehen, dass es mit dem letzten „origin/master“ Branch, welche ja unserem lokalen „master“ Branch entsprochen hat, keine Konflikte gibt.

        Das bringt den anderen Entwicklern jetzt noch nichts. Nun müssen wir diese Änderungen auch auf den Remote Repository pushen. Aber wie wir schon im zweiten Teil unserer Blogreihe gelernt haben, müssen wir vorher checken, ob die anderen auch schon Änderungen gemacht und am Remote Repository gepusht haben.

        Ich bevorzuge an dieser Stelle einen Fetch. In der Zusammenfassung schaue ich mir auch an, ob und was andere Entwickler gemacht haben:

        Wir sehen, dass sich am Remote Repository seit unserem letzten Fetch nichts getan hat, somit können wir beruhigt pushen:

        Wenn wir jetzt in den Browser Repository wechseln, dann werden wir auch sehen, dass dort unsere Änderungen bzw. unsere Feature Entwicklung sichtbar ist:

        Was man hier noch gut sieht ist, dass nur die Deltas ausgetauscht worden sind. Die nicht geänderten Files haben noch immer den letzten Status und auch die letzte Commit Beschreibung, weil wir selbst die anderen Files, auch wenn wir am Projekt was geändert haben, nicht manipuliert haben.

        Wie funktioniert das Conflict Handling mit Git?

        In unserem Fall war das jetzt ganz einfach, da kein anderer Entwickler uns in die Quere kommen konnte. Aber wie ein Konflikt aussehen würde, haben wir hier für Sie simuliert.

        Ich habe mich umentschieden und in meiner WebIDE im Label doch einen anderen Text eingetragen:

        Diese Änderung werde ich jetzt wie gewohnt in die Staging Area bringen und mit einer entsprechenden Beschreibung einen Commit durchführen:

        Wir machen einen Fetch um zu sehen, ob andere Entwickler auch was gemacht haben:

        Da sehen wir jetzt, dass ein anderer Entwickler auch etwas geändert hat. Vorerst kein Problem, das ist ja eine ganz normale Situation, da unser Entwicklungsteam groß ist.

        Was für uns aber neu ist, ist dieser Indikator:

        Das bedeutet wir haben einen Commit seit dem letzten Merge gemacht und auch am dazugehörigen Remote Repo. hat es einen Commit seither gegeben.

        Wir machen jetzt einen Merge, um die zwei Datenstände miteinander zu vereinen und da bemerken wir, dass es Konflikte gibt:

        Ein Klick auf „Resolve Conflicts“ und dann landen wir es in einen grafischen Editor für das Beheben der Konflikte:

        Hier sieht man die zwei Versionen einander gegenübergestellt und auch die Version, die nach unserer Konfliktbehebung entstehen würde.

        Mit den Buttons rechts oben könnten wir auf die Schnelle sagen, ob wir unsere Änderungen oder die Änderungen vom Remote Repo. nehmen möchten. Hinter diesem grafischen Editor steht eigentlich nichts anderes als ein Code mit bestimmten Abschnitten und Markierungen, wo Konflikte aufgetreten sind:

        Also könnte man im grafischen Editor die Konflikte lösen, aber auch im Code. Man würde hier genau diesen Abschnitt rausschmeißen, welchen man als veraltet empfindet.

        Wenn wir alle Konflikte behoben haben, dann bleibt uns nichts anderes mehr übrig, als einen Commit zu machen, je nachdem wie viel Zeit wir für die Konflikten aufgewendet haben, wieder einen Fetch mit Merge zu machen und anschließend unseren Code zu pushen.

        Bei einem Conflict Handling haben wir während dem Beheben auch nicht alle Funktionen zur Verfügung:

        Wir können lediglich einen Fetch machen und uns den aktuellen Stand holen oder die bereits gemachten Änderungen zurücksetzen.

        Nach einem Commit von unserer Fehlerbehebung sehen wir am Indikator, dass wir nun nicht einen Commit vor und auch gleichzeitig nach dem origin/master sind, sondern zwei Commits voraus. Einmal haben wir ja unser Label geändert und einmal einen Merge mit Konfliktbehebung (= erneuter Commit) gemacht.

        Zusammenfassung – Git Tutorial

        Jetzt steht uns nichts mehr im Wege! Wir haben gelernt, wie wir unsere Entwicklungen mit Git optimieren können und in diesem Bereich vor allem das Zusammenarbeiten mit anderen Entwicklern. Der nächste und letzter Teil unserer Blogreihe, nämlich ein Exkurs von Martin Koch verfasst und präsentiert, wird nächste Woche veröffentlicht.

        Git und SAPUi5

        Sind Sie auf der Suche nach SAP Cloud Consulting oder ganz allgemein SAP Beratung in Österreich, Deutschland oder der Schweiz? Dann sind Sie bei uns genau richtig! Wir bringen sie sicher in die Cloud und kümmern uns um ihr SAP Szenarien. Wir lassen sie nicht hängen- we deliver !