Added everything for Step 8: Binding Paths: Accessing Properties in H…

…ierarchically Structured Models
wridgeu · May 20, 2020 · 554f7ad · 554f7ad
1 parent 4bfc672
commit 554f7ad
Show file tree

Hide file tree

Showing 5 changed files with 47 additions and 6 deletions.
diff --git a/webapp/controller/Home.controller.js b/webapp/controller/Home.controller.js
@@ -13,7 +13,12 @@ sap.ui.define(
           firstName: "Harry",
           lastName: "Hawk",
           enabled: true,
-          panelHeaderText: "Data Binding Basics",
+          address: {
+            street: "Dietmar-Hopp-Allee 16",
+            city: "Walldorf",
+            zip: "69190",
+            country: "Germany"
+          }
         });
 
         //Set model globally for all views/controls (dirty) "sap.ui.getCore().setModel(oModel);""

diff --git a/webapp/i18n/i18n.properties b/webapp/i18n/i18n.properties
@@ -1,3 +1,14 @@
 title=UI5-Data-Binding
 appTitle=UI5-Data-Binding
 appDescription=UI5 Data Binding Walkthrough
+
+# Field labels
+firstName=First Name
+lastName=Last Name
+enabled=Enabled
+address=Address
+
+
+# Screen titles
+panel1HeaderText=Data Binding Basics 
+panel2HeaderText=Address Details
diff --git a/webapp/i18n/i18n_de.properties b/webapp/i18n/i18n_de.properties
@@ -1,7 +1,12 @@
+title=UI5-Data-Binding
+appTitle=UI5-Data-Binding
+appDescription=UI5 Data Binding Walkthrough
+
 # Field labels
 firstName=Vorname
 lastName=Nachname
 enabled=Aktiviert
 
 # Screen titles
-panelHeaderText=Data Binding Grundlagen
+panel1HeaderText=Data Binding Grundlagen
+panel2HeaderText=Adressdetails
diff --git a/webapp/i18n/i18n_en.properties b/webapp/i18n/i18n_en.properties
@@ -1,3 +1,14 @@
 title=UI5-Data-Binding
 appTitle=UI5-Data-Binding
 appDescription=UI5 Data Binding Walkthrough
+
+# Field labels
+firstName=First Name
+lastName=Last Name
+enabled=Enabled
+address=Address
+
+
+# Screen titles
+panel1HeaderText=Data Binding Basics 
+panel2HeaderText=Address Details
diff --git a/webapp/view/Home.view.xml b/webapp/view/Home.view.xml
@@ -1,14 +1,23 @@
 <mvc:View controllerName="com.mrb.UI5-Data-Binding.controller.Home" displayBlock="true" 
   xmlns="sap.m" 
+  xmlns:l="sap.ui.layout" 
   xmlns:mvc="sap.ui.core.mvc">
   <Page titleAlignment="Center" title="{i18n>title}">
-    <Panel headerText="{i18n_example>panelHeaderText}" class="sapUiResponsiveMargin" width="auto">
+    <Panel headerText="{i18n>panel1HeaderText}" class="sapUiResponsiveMargin" width="auto">
       <content>
-        <Label text="{i18n_example>firstName}" class="sapUiSmallMargin" />
+        <Label text="{i18n>firstName}" class="sapUiSmallMargin" />
         <Input value="{/firstName}" valueLiveUpdate="true" width="200px" enabled="{/enabled}" />
-        <Label text="{i18n_example>lastName}" class="sapUiSmallMargin" />
+        <Label text="{i18n>lastName}" class="sapUiSmallMargin" />
         <Input value="{/lastName}" valueLiveUpdate="true" width="200px" enabled="{/enabled}" />
-        <CheckBox selected="{/enabled}" text="{i18n_example>enabled}" />
+        <CheckBox selected="{/enabled}" text="{i18n>enabled}" />
+      </content>
+    </Panel>
+    <Panel headerText="{i18n>panel2HeaderText}" class="sapUiResponsiveMargin" width="auto">
+      <content>
+        <l:VerticalLayout>
+          <Label class="sapUiSmallMargin" text="{i18n>address}:"/>
+          <FormattedText class="sapUiSmallMarginBegin sapUiSmallMarginBottom" htmlText="{/address/street}&lt;br&gt;{/address/zip} {/address/city}&lt;br&gt;{/address/country}" width="200px"/>
+        </l:VerticalLayout>
       </content>
     </Panel>
   </Page>