Format Date
Formats a date/time using the specified locale and options.
Localization is handled by the browser's Intl.DateTimeFormat API. No language packs are required.
p("Web Awesome 2 release date 🎉"),FormatDate(_.date := "2020-07-15T09:17:00-04:00")()The date attribute determines the date/time to use when formatting. It must be a string that Date.parse() can interpret or a Date object set via JavaScript. If omitted, the current date/time will be assumed.
When using strings, avoid ambiguous dates such as 03/04/2020 which can be interpreted as March 4 or April 3 depending on the user's browser and locale. Instead, always use a valid ISO 8601 date time string to ensure the date will be parsed properly by all clients.
Examples
Date & Time Formatting
Formatting options are based on those found in the Intl.DateTimeFormat API. When formatting options are provided, the date/time will be formatted according to those values. When no formatting options are provided, a localized, numeric date will be displayed instead.
div("Human-readable date: ", FormatDate(_.month.long, _.day.numeric, _.year.numeric)())div("Time: ", FormatDate(_.hour.numeric, _.minute.numeric)())div("Weekday: ", FormatDate(_.weekday.long)())div("Month: ", FormatDate(_.month.long)())div("Year: ", FormatDate(_.year.numeric)())div("No formatting options: ", FormatDate()())Hour Formatting
By default, the browser will determine whether to use 12-hour or 24-hour time. To force one or the other, set the hour-format attribute to 12 or 24.
div("12-hour: ", FormatDate(_.hour.numeric, _.minute.numeric, _.hourFormat := "12")())div("24-hour: ", FormatDate(_.hour.numeric, _.minute.numeric, _.hourFormat := "24")())Time Zone
Use the time-zone attribute to express the time in a specific time zone.
div("UTC: ", FormatDate(_.hour.numeric, _.minute.numeric, _.timeZone := "UTC")())div( "Pacific: ", FormatDate(_.hour.numeric, _.minute.numeric, _.timeZone := "America/Los_Angeles")())div("Tokyo: ", FormatDate(_.hour.numeric, _.minute.numeric, _.timeZone := "Asia/Tokyo")())