In this quick tip we learn how to use the Formatted As operator to format numbers.

In this Quick Tip, we’re going to learn how to use the formatted as operator on numbers. There are a couple different use cases for the formatted as operator.

In this example, we have some products that all have prices attached to them, but they’re not being displayed as currency. We also have a discount rate for these products that isn’t showing how much it’s discounted by.

In these text elements, where we have our expressions, we can add the formatted as operator to it.

The properties for formatted as will give us different displays for numbers that we can use. It will let us format for Numbers, Currency, or Percentages. Each of these displays let us control where the Decimal place is, a Decimal separator, a Thousand separator, and if we should Use parentheses for negative numbers.

If we change this display from Number to Currency, we have an additional field to show any type of Currency symbol that is supported. If we change this to Percentage, we’ll see the number we’re getting treated as a percent. So when we preview, we'll now see a Currency symbol and Percentage symbol show automatically before these numbers with the Decimal and Thousands separator we set.

Remember this is purely being formatted using the formatted as operator and no calculations have been made. And now, when you do make calculations, it will format correctly.

That's it for this Quick Tip! For more, be sure to check out bubble.io/academy.
​