Formatters
You can use built-in formatters or create your own custom formatters.
Number formatter
Number formatter formats numeric values for display purposes.
Formatter: '#'
Formatted Value = ۱۲۳٬۴۵۶
Formatter: '#'
Formatted Value = ۱۲٬۳۴۵٫۱۲
Currency formatter
Currency formatter formats numeric values as currency for display purposes.
Formatter: '$':'USD'
Formatted Value = $۱۲۳٬۴۵۶٫۰۰
Formatter: '$':'IRR'
Formatted Value = ریال ۱۲٬۳۴۵
Date formatter
Date formatter formats date values for display purposes.
A date formatter accepts dates of type Date, number (timestamp), or string (ISO 8601 date string).
- Using predefined styles for date and time:
@:dateStyle:timeStyle:zone:[name, display]:calendar- dateStyle: 'short' | 'medium' | 'long' | 'full',
- timeStyle: 'short' | 'medium' | 'long' | 'full',
- zone: [name: string, display: string],
- calendar: string.
The calendar to use, such as "chinese", "gregory", "persian",
- Using custom Intl.DateTimeFormatOptions to specify detailed formatting options.
'@':{ ...Intl.DateTimeFormatOptions }
The date formatter uses the Intl.DateTimeFormat API under the hood, which provides a wide range of options for customizing the date and time formatting.
Field formatter
A field formatter formats an object by extracting a specific field from it.
This example shows how to use a formatter to display the 'name' field of an object.
Formatter = 'name'
Formatted Value = "Sample Name"
Array index formatter
An array index formatter formats an array by extracting the element at a specific index.
This example shows how to use a formatter to display the element at index 1 of an array.
Formatter: 2
Formatted Value = Third
Currency formatter
Currency formatter formats numeric values as currency for display purposes.
Locale Formatters
A locale formatter formats a value into a human-readable string based on the app Locale.
A Locale formatter starts with the * character followed by the formatter name.
This example shows how to use locale formatters to format enums. .
Composite formatters
A Composite formatter is a series of formatters that are applied sequentially to transform data through multiple stages.
Each formatter in the chain processes the output of the previous formatter, allowing for complex data transformations.
This example shows how to combine multiple formatters to achieve the desired output format.