{{format-relative-time}}
Uses Intl.RelativeTimeFormat to format the time relative to now.
gts
import type { TOC } from '@ember/component/template-only';
import { formatRelativeTime } from 'ember-intl';
interface ExampleSignature {
Args: {};
}
const Example: TOC<ExampleSignature> = <template>
Past: {{formatRelativeTime -1}}
Now: {{formatRelativeTime 0}}
Future: {{formatRelativeTime 3}}
</template>;
export default Example;options.format
In app/ember-intl.{js,ts}, you can use the formatRelativeTime 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 { formatRelativeTime } from 'ember-intl';
interface ExampleSignature {
Args: {};
}
const Example: TOC<ExampleSignature> = <template>
{{formatRelativeTime -1 format="compact"}}
</template>;
export default Example;ts
import type { Formats } from 'ember-intl';
export const formats: Formats = {
formatRelativeTime: {
compact: {
style: 'narrow',
},
},
};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 { formatRelativeTime } from 'ember-intl';
interface ExampleSignature {
Args: {};
}
const Example: TOC<ExampleSignature> = <template>
<div lang="en-us">
{{formatRelativeTime -1 locale="en-us"}}
</div>
<div lang="de-de">
{{formatRelativeTime -1 locale="de-de"}}
</div>
</template>;
export default Example;Additional options
You can use named arguments to pass the options that Intl.RelativeTimeFormat supports. Some of these options are listed below.
numericstyleunit
gts
import type { TOC } from '@ember/component/template-only';
import { formatRelativeTime } from 'ember-intl';
interface ExampleSignature {
Args: {};
}
const Example: TOC<ExampleSignature> = <template>
Past: {{formatRelativeTime -1 unit="month"}}
Now: {{formatRelativeTime 0 unit="day"}}
Future: {{formatRelativeTime 3 unit="week"}}
</template>;
export default Example;