Data Mapping Tool
We have seen in the previous section what are variables and expressions and why they are useful for dynamic and data-rich applications. We will see how to use them in your application pages and workflows. When using dynamic properties for interface elements or workflow nodes configuration, Infinable provides a tool to easily access variables and apply basic or complex expressions on it.
Data Mapping Tool to select which dynamic property should be used for the City Image
In the example above, on the Home Page of the AirBnB clone, we have selected "Dynamic" for the image configuration in the right sidebar as the image to display will be the cover image of the cities data sources:
City Data Source in the AirBnB clone data model
We have selected "Cover Image" in the information tree in the Data Mapping Tool. We can see that this information is coming from the parent element "City Box" which is repeated based on the list of cities (view Repeating Elements for more details). This is what we call "Local Data", information coming from a repeated item.
Sometimes, you don't just want to display "raw" information but you might want to transform it before and this is where the other sections of the data mapping tool come into the game 😀.
For example, on the confirmation page of the AirBnB clone, you might need to display in a text interface element the total amount to pay for the booking: price per night x number of nights (to simplify). We need to perform a multiplication of two dynamic properties: the price per night of a place (this information is available in the data model) and the number of nights which is determined from the check-in and check-out dates (we need a way to get the number of days between those two dates). Infinable provides a rich list of operations which can be used in different scenarios.
There are different sections depending on the type of information you want to transform:
- General Operations
- Math Functions
- Text Processing Functions
- Date & Time processing functions
- Array processing functions
In the majority of cases, you need to use a combination of the most common functions to achieve the desired effects.
For example, you can perform basic math operations with the arithmetic operators such as + for addition, – for subtraction, / for division and * for multiplication.
Last modified 3yr ago