Formatting values is a must-have to deliver a great user experience in any application. This is why valueFormatters are one of the most used features of ag-Grid, giving users a great degree of flexibility with how their data is displayed.
What is a valueFormatter? The short, pithy and high-level answer is: _something that makes the data easier to understand for people. _The valueFormatter is a tool built to help people understand the data better, not the machine. To find out more, check out our documentation.
In this post, I’ll illustrate how to format numbers, strings and currencies, along with some useful gotchas and examples. So grab a grid, grab some coffee and let’s get formatting!
To illustrate, I’ll be using the following Plunker:
You’ll see three pairs of columns, each pair consists of one unformatted column and a duplicate column using a value formatter.
Let’s go over these left to right, with each pair getting progressively more complex.
In this blog, we’ll be going over:
- Number formatting with an inline valueFormartter
- String formatting with an external valueFormatter
- Formatting the filter values
- Formatting Currency by Passing Parameters to a valueFormatter
Recently I also made a video covering all the subjects in this and the next valueFormatters blog. So if you don’t like the sound of my typing and prefer the sound of my voice, check it out!
#ag-grid #formatting #string #coding
