Attributes

Formatting

Attribute	Values	Description
`data-format`	`currency`, `number`, `integer`, `percentage`, `auto`	Output format for the displayed value
`data-hide-zero-cents`	`true` / `false`	When `true`, omit `.00` for round numbers
`data-hide-if-zero`	`true` / `false`	When `true`, hide the entire element when the value is `0`
`data-hide-if-false`	`true` / `false`	When `true`, hide the entire element when the value is `false` (or any falsy value)
`data-decimal-places`	integer	Override the default decimal places for the chosen format

Math

All math operators take either a literal number or another display path.

Attribute	Operation	Example
`data-multiply-by`	`value × operand`	`data-multiply-by="12"`
`data-divide-by`	`value ÷ operand`	`data-divide-by="100"`
`data-add`	`value + operand`	`data-add="package.123.tax"`
`data-subtract`	`value − operand`	`data-subtract="cart.total"`

When multiple operators are present on the same element, they evaluate in order: multiply → divide → add → subtract.

Raw Values

Append .raw to a numeric display path to access the underlying number rather than the formatted string. Required when the value is the input to a math operator.

<span data-next-display="cart.total.raw"
      data-multiply-by="0.1"
      data-format="currency">$9.90</span>

Notes

All formatting and math attributes apply only to elements with data-next-display. They are silently ignored on other elements.
The currency symbol used by data-format="currency" is the active campaign currency (campaignStore.data.currency).
For visibility based on a state expression (rather than the element's own value), use State Attributes (data-next-show / data-next-hide) instead.

Display Attributes — data-next-display syntax
State Attributes — conditional visibility

Formatting

Math

Raw Values

Notes

Related

On this page