This repository is meant to serve as example for how data binding works within UI5. It is basically what happens when you work through the entire "Data-Binding"-Section within the official UI5 documentation.
You can just clone this repository, run npm install and use the UI5 tooling to locally serve the application in order to debug/learn from it.
- Note: it already uses the livereload-middleware for the UI5 tooling, so changes while serving will trigger an immediate update in the browser.
- Clone the repository
$> git clone <repository-url>
- Navigate into the cloned repository
$> cd <repository>
- Install all dependencies
$> npm install - Start the application
$> npm start
The paths within this project are - as usual - prefixed by the projectId ( which is declared within the manifest.json file). The prefix is made up by a given namespace and the name of the project. I must admit that the project name is quite verbose.
- Namespace:
com.mrb - Projectname:
UI5-Data-Binding
- Step 1: No Data Binding ✅ 3e3bee0
- Step 2: Create a Model ✅ 24e6a13
- Step 3: Create Property Binding ✅ 79ea293
- Step 4: Two-Way Binding ✅ 4514324
- Step 5: One-Way Binding ✅ cb37402
- Step 6: Resource Models ✅ 7fe1738
- Step 7: Resource Bundles and Multiple Languages ✅ 27418b9
- Addition: Reverted Step 6 & 7 as the Resource Model is handled in manifest.json nowadays ✅ e4e3f1e
- Step 8: Binding Paths - Accessing Properties in Hierarchically Structured Models ✅ 554f7ad
- Step 9: Formatting Values ✅ d077849
- Step 10: Property Formatting Using Data Types ✅ d0a74fd
- Step 11: Validation Using the Message Manager ✅ c1537fa
- Step 12: Aggregation Binding Using Templates ✅ c54bfd7
- Step 13: Element Binding ✅ ff5114c
- Step 14: Expression Binding ✅ eb30253
- Step 15: Aggregation Binding Using a Factory Function ✅ 3b8f0b0
Implemented = ✅