0

Trying to display the Time in LWC component by using lightning-formatted-time, by default it print HH:MM:SS

I would like to print only HH:MM

<lightning-formatted-time value={stime.Start_Time__c}> </lightning-formatted-time> -
<lightning-formatted-time value={stime.End_Time__c}></lightning-formatted-time>

the Above code print as below

12:00:00 AM -12:30:00 AM Excepted is to print 12:00 AM -12:30 AM

Gone through the documents, I dont see any attributes supported for this.

https://developer.salesforce.com/docs/component-library/bundle/lightning-formatted-time/documentation

Can Anyone help me on this, Thanks in Advance.

1 Answer 1

0

The standard component does not support this. You need to use the Internationalization Properties. Create a custom component like below. And use that instead of the standard formatted time.

JS

import { LightningElement } from 'lwc';
import LOCALE from '@salesforce/i18n/locale';

export default class CustomFormattedTime extends LightningElement {
    number = 123456.78;
    formattedNumber = new Intl.DateTimeFormat(LOCALE, { hour:"numeric", minute: "numeric", hour12: false}).format(this.number);
}

HTML

<template>
    {formattedNumber}
</template>

Here is the playground example. You can customize it further if needed.

References for Intl.DateTimeFormat

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .