Expand my Community achievements bar.

SOLVED

Current Date & Time using HTL

Avatar

Level 5

Hello - Is there a way to get/retrieve the current date & time in HTL (component) without writing any Sling model or Use API. 

1 Accepted Solution

Avatar

Correct answer by
Community Advisor

Hi @v1101 ,

Since sightly is also an html so in html you don't have any option to get the current date and time without using java or javascript. We have some exception in sightly like availability of global objects but again we don't have any global objects which will give you the current date and time.

So you will have to use either java or javascript to get the date and time, if you have already java implemented for the component then add one filed for the same and display on the page otherwise use javascript use API or vanila js to accomplish the same.

You can refer the below link:

https://stackoverflow.com/questions/39654779/fetch-current-time-by-using-aem-sightly

 

Hope this will help

Umesh Thakur 

View solution in original post

6 Replies

Avatar

Correct answer by
Community Advisor

Hi @v1101 ,

Since sightly is also an html so in html you don't have any option to get the current date and time without using java or javascript. We have some exception in sightly like availability of global objects but again we don't have any global objects which will give you the current date and time.

So you will have to use either java or javascript to get the date and time, if you have already java implemented for the component then add one filed for the same and display on the page otherwise use javascript use API or vanila js to accomplish the same.

You can refer the below link:

https://stackoverflow.com/questions/39654779/fetch-current-time-by-using-aem-sightly

 

Hope this will help

Umesh Thakur 

Avatar

Community Advisor

It's always best practice to use the sling models. so that you can use more OOTB Apis to get the date and time.

Please visit this link - https://github.com/adobe/htl-spec/blob/master/SPECIFICATION.md#1222-dates

 

1.2.2.2. Dates

Date formatting supports timezones and localisation. In case internationalisation is also specified (i18n), it will be applied to the formatting pattern and the locale will be passed forward to formatting.

<!--/* Formatting pattern: */-->
${'yyyy-MM-dd' @ format=myDate}
${'yyyy-MM-dd' @ format=myDate, type='date'}                <!--/* Forced formatting type */-->
${'yyyy-MM-dd HH:mm' @ format=myDate, timezone='GMT+00:30'} <!--/* Timezone */-->
${'EEEE, dd MMMM yyyy' @ format=obj.date, locale='de'}      <!--/* Locale */-->

The formatting pattern supports, at minimum, the following letters:

  • y - Year. Variants: yy, yyyy
  • M - Month in year. Variants: MM, MMM, MMMM
  • w - Week in year. Variants: ww
  • D - Day in year. Variants: DD, DDD
  • d - Day in month. Variants: dd
  • E - Day name in week. Variants: EEEE
  • a - Am/pm marker
  • H - Hour in day (0-23). Variants: HH
  • h - Hour in am/pm. Variants: hh
  • m - Minute in hour. Variants: mm
  • s - Second in minute. Variants: ss
  • S - Millisecond. Variants: SSS
  • z - General time zone
  • Z - RFC 822 time zone
  • X - ISO 8601 time zone. Variants: XX, XXX

All other characters from 'A' to 'Z' and from 'a' to 'z' are reserved for future possible use; if needed, they can be escaped using single quotes. Single quotes are escaped as two in a row. Other characters are not interpreted.

Examples

${'yyyy-MM-dd HH:mm:ss.SSSXXX' @ format=obj.date, timezone='UTC'}
${'yyyy-MM-dd HH:mm:ss.SSSXXX' @ format=obj.date, timezone='GMT+02:00'}
${'yyyy-MM-dd HH:mm:ss.SSS(z)' @ format=obj.date, timezone='GMT+02:00'}
${'yyyy-MM-dd HH:mm:ss.SSSZ' @ format=obj.date, timezone='GMT+02:00'}
${'dd MMMM \'\'yy hh:mm a; \'day in year\': D; \'week in year\': w' @ format=obj.date, timezone='UTC'}
${'EEEE, d MMM y' @ format=obj.date, timezone='UTC', locale='de'}
${'EEEE, d MMM y' @ format=obj.date, timezone='UTC', locale='en_US', i18n}

will generate the following output for the date 1918-12-01 00:00:00Z

1918-12-01 00:00:00.000Z
1918-12-01 02:00:00.000+02:00
1918-12-01 02:00:00.000(GMT+02:00)
1918-12-01 02:00:00.000+0200
01 December '18 12:00 AM; day in year: 335; week in year: 49
Sonntag, 1 Dez 1918
Sunday, Dec 1, 1918  <!--/* assuming the formatter 'EEEE, d MMM y' will be translated to 'EEEE, MMM d, y' for the 'en_US' locale by 

Avatar

Community Advisor

I agree with @Umesh_Thakur . Why don't you try server side JS, it will be much easy than writing an entire Sling Model for just getting a date.

Avatar

Community Advisor

@v1101, if you are not trying to retrieve a date from a resource in AEM, and only want to retrieve the current date of NOW, you can use JavaScript. Call:

let date = new Date();