{{format-number}}
Uses Intl.NumberFormat to format a number.
gts
import type { TOC } from '@ember/component/template-only';
import { formatNumber } from 'ember-intl';
interface ExampleSignature {
Args: {};
}
const Example: TOC<ExampleSignature> = <template>
{{formatNumber 12345}}
</template>;
export default Example;options.format
In app/ember-intl.{js,ts}, you can use the formatNumber key to define the formats that you want to reuse for the helper. Pass the name of your format to format.
gts
import type { TOC } from '@ember/component/template-only';
import { formatNumber } from 'ember-intl';
interface ExampleSignature {
Args: {};
}
const Example: TOC<ExampleSignature> = <template>
{{formatNumber 12345 format="EUR"}}
</template>;
export default Example;ts
import type { Formats } from 'ember-intl';
export const formats: Formats = {
formatNumber: {
EUR: {
currency: 'EUR',
style: 'currency',
},
},
};options.locale
You can display the text in another locale (i.e. independently from the user's preferred locale). Pass the name of the locale to locale.
gts
import type { TOC } from '@ember/component/template-only';
import { formatNumber } from 'ember-intl';
interface ExampleSignature {
Args: {};
}
const Example: TOC<ExampleSignature> = <template>
<div lang="en-us">
{{formatNumber 12345 locale="en-us"}}
</div>
<div lang="de-de">
{{formatNumber 12345 locale="de-de"}}
</div>
</template>;
export default Example;Additional options
You can use named arguments to pass options that Intl.NumberFormat supports. Some of these options are listed below.
currencymaximumFractionDigitsmaximumSignificantDigitssignDisplaystyle
gts
import type { TOC } from '@ember/component/template-only';
import { formatNumber } from 'ember-intl';
interface ExampleSignature {
Args: {};
}
const Example: TOC<ExampleSignature> = <template>
{{formatNumber
12345
currency="EUR"
maximumFractionDigits=1
notation="compact"
roundingMode="ceil"
style="currency"
}}
</template>;
export default Example;