How can I quickly get today's date in a Lightning Component? (for use in an attribute)

Question

In Visualforce, we could merge {!TODAY()} directly in the markup. What is the equivalent in a Lightning Component?

Answer 1

You create an attribute and initialize it using $A.localizationService in your controller.

Component:

<aura:component>
   <aura:handler name="init" action="{!c.init}" value="{!this}" />
   <aura:attribute name="today" type="Date" />
   <ui:outputDate value="{!v.today}" />
</aura:component>

Controller:

init : function(component, event, helper) {
    var today = $A.localizationService.formatDate(new Date(), "YYYY-MM-DD");
    component.set('v.today', today);
}

Answer 2

I have a slight modification to the JS you proposed, as you will run into comparison errors if the day is a single digit as well. Modifying the script like so fixed the problem:

var today = new Date();
var monthDigit = today.getMonth() + 1;
if (monthDigit <= 9) {
  monthDigit = '0' + monthDigit;
}
var dayDigit = today.getDate();
if(dayDigit <= 9){
  dayDigit = '0' + dayDigit;
}
component.set('v.today', today.getFullYear() + "-" + monthDigit + "-" + dayDigit);

Answer 3

We can use below code as well.

//get today's date
var today = new Date();
var dd = String(today.getDate()).padStart(2, '0');
var mm = String(today.getMonth() + 1).padStart(2, '0'); //January is 0!
var yyyy = today.getFullYear();
today = yyyy + '-' + dd + '-' + mm;`

Answer 4

As above //get today's date var today = new Date(); var dd = String(today.getDate()).padStart(2, '0'); var mm = String(today.getMonth() + 1).padStart(2, '0'); //January is 0! var yyyy = today.getFullYear();

however, if your local time format is different (e.g. UK), change the order.

today = yyyy + '-' + mm + '-' + dd;

You can also add a time if your attribute is of type datetime:

today = yyyy + '-' + mm + '-' + dd + ', 11:45 pm GMT';

or

today = yyyy + '-' + mm + '-' + dd + ', 21:45';

Not that Apex and Javastring formats are different.

apex format “yyyy-MM-dd HH:mm:ss”

javascript format "2019-11-06T10:38:00.000Z"

so, if you are populating a datetime attribute, use

today = yyyy + '-' + mm + '-' + dd + 'T09:30:00';
component.set('v.newEvent.StartDateTime', today);