Angular: How to Tell If a Date Is Today's Date

Does your Angular app have a business requirement to determine if a given date is today's date? If so, read on.

In this guide, I'll show you how to make that comparison.

You can also check out the source on GitHub. I've got some other date-releated convenience methods in that class.

But if you'd rather learn about the whys and wherefores, read on.

Going Short

Here's how to make it happen: get the short date of the given date and the short date of today's date. Then, compare the two.

If they're equal, then the given date is today's date.

Now if you're new to Angular and dates, you might be wondering what I mean by the "short date."

That's the formatting you get if you use DatePipe to format the object with the 'shortDate' formatting code.

Take a look at this:

let date: Date = new Date();
let dateVal: number = date.getTime();
let datePipe: DatePipe = new DatePipe('en-US');
console.log(datePipe.transform(dateVal, 'shortDate'));

Since today is February 5, 2021, that code will spit out 2/5/21 in the console.

If I also format the given date with 'shortDate' then compare it to what I got above, the two will be equal if the given date is today's date.

So as you can see from above, it's pretty easy to get today's date in short date format. But what about the given date?

That might not already be in short date format. What do you do in that case?

Formatting the Given Date

Fortunately, TypeScript makes it pretty easy to get a date string in any format you want. 

If you have a date string (like 'Feb 5, 2021'), you can just instantiate the Date object with that string. Then you'll have a Date object that you can format.

So this will give you the same results as the code above:

let date: Date = new Date('Feb 5, 2021');
let dateVal: number = date.getTime();
let datePipe: DatePipe = new DatePipe('en-US');
console.log(datePipe.transform(dateVal, 'shortDate'));

That might be all you need to do with whatever date string you're dealing with.

On the other hand, you might have a numerical date value. That would be the number of milliseconds since 1970 started.

If that's the case, then you're one step ahead. The aforementioned DatePipe class can format that number with 'shortDate'.

In fact, you see that happening in the code above.

Putting It All Together

Here's a convenience method I use to determine if a given date is today's date.

  isToday(dateValue: number): boolean {
      let today = Date.now();
      let todayDate = this.getShortDateDisplay(today);
      let otherDate = this.getShortDateDisplay(dateValue);

      let isToday = (todayDate === otherDate);
      return isToday;
  }

That method accepts the given date as a numerical value. 

Then, it gets the current timestamp with Date.now(). That's also a numerical value.

After that, the code formats both numbers to the short date value.

Finally, it comapres the two date values. If they match, then the given date is today.

By the way, if you don't have the given date as a number but as a Date object, you can translate it to a number by just invoking the getTime() method on it.

You can see an example of how to use getTime() in the previous section.

Wrapping It Up

That's all you need to do to make yourself happy with this assignment.

Again, if you're looking for a service that's loaded with date-related convenience methods, feel free to grab the one I created.

And use it as you see fit.

Have fun!

Photo by Bich Tran from Pexels