ember-intl

formatDisplayName

Uses Intl.DisplayNames to format the name of a currency, language, region, etc.

gts
import type { TOC } from '@ember/component/template-only';
import { formatDisplayName } from 'ember-intl';

interface ExampleSignature {
  Args: {};
}

const Example: TOC<ExampleSignature> = <template>
  {{formatDisplayName "MXN" type="currency"}}
</template>;

export default Example;

IMPORTANT

type is a required option because Intl doesn't specify the default value. The possible values are 'calendar', 'currency', 'dateTimeField', 'language', 'region', and 'script'.

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 { formatDisplayName } from 'ember-intl';

interface ExampleSignature {
  Args: {};
}

const Example: TOC<ExampleSignature> = <template>
  <div lang="en-us">
    {{formatDisplayName "DE" locale="en-us" type="region"}}
  </div>

  <div lang="de-de">
    {{formatDisplayName "DE" locale="de-de" type="region"}}
  </div>
</template>;

export default Example;

Intl ​

You can use named arguments to pass the options that Intl.DisplayNames supports. Some of these options are listed below.

  • languageDisplay (applicable only for type="language")
  • style
  • type
gts
import type { TOC } from '@ember/component/template-only';
import { formatDisplayName } from 'ember-intl';

interface ExampleSignature {
  Args: {};
}

const Example: TOC<ExampleSignature> = <template>
  {{formatDisplayName "nl-be" languageDisplay="standard" type="language"}}
</template>;

export default Example;