What causes "Invalid date "${date}". Date has to be greater than 0." in angular/components?

Ensure day values are >= 1; clamp or validate before calling createDate.

Invalid date "${date}". Date has to be greater than 0.

Error message

Invalid date "${date}". Date has to be greater than 0.

What it means

DateFnsAdapter.createDate throws when the day-of-month argument is less than 1. Day 0 or negative days are invalid and would silently shift into the previous month if passed to the native Date, so the adapter rejects them early (dev mode).

Source

Thrown at src/material-date-fns-adapter/adapter/date-fns-adapter.ts:140

  getNumDaysInMonth(date: Date): number {
    return getDaysInMonth(date);
  }

  clone(date: Date): Date {
    return new Date(date.getTime());
  }

  createDate(year: number, month: number, date: number): Date {
    if (typeof ngDevMode === 'undefined' || ngDevMode) {
      // Check for invalid month and date (except upper bound on date which we have to check after
      // creating the Date).
      if (month < 0 || month > 11) {
        throw Error(`Invalid month index "${month}". Month index has to be between 0 and 11.`);
      }

      if (date < 1) {
        throw Error(`Invalid date "${date}". Date has to be greater than 0.`);
      }
    }

    // Passing the year to the constructor causes year numbers <100 to be converted to 19xx.
    // To work around this we use `setFullYear` and `setHours` instead.
    const result = new Date();
    result.setFullYear(year, month, date);
    result.setHours(0, 0, 0, 0);

    // Check that the date wasn't above the upper bound for the month, causing the month to overflow
    if (result.getMonth() != month && (typeof ngDevMode === 'undefined' || ngDevMode)) {
      throw Error(`Invalid date "${date}" for month with index "${month}".`);
    }

    return result;
  }

  today(): Date {

View on GitHub (pinned to 0411926e7d)

Solutions

Ensure day values are >= 1; clamp or validate before calling createDate.
For previous/next day arithmetic use addDays instead of decrementing raw day numbers.
Validate form input so empty/zero values never reach createDate.

Example fix

// before
const prevDay = this.adapter.createDate(2024, 0, day - 1); // day=1 -> date=0, throws
// after
const prevDay = this.adapter.addCalendarDays(this.adapter.createDate(2024, 0, day), -1);

Defensive patterns

Strategy: validation

Validate before calling

if (!Number.isInteger(date) || date < 1) {
  throw new RangeError(`date must be >= 1, got ${date}`);
}
const d = adapter.createDate(year, month, date);

Type guard

function isValidDayOfMonth(d: unknown): d is number {
  return typeof d === 'number' && Number.isInteger(d) && d >= 1 && d <= 31;
}

Try / catch

try {
  return this.adapter.createDate(year, month, day);
} catch (e) {
  if ((e as Error).message.startsWith('Invalid date "')) {
    return this.adapter.today(); // or clamp day to 1
  }
  throw e;
}

Prevention

Reject day 0/negatives from forms before building dates
Use addCalendarDays for relative day shifts instead of decrementing day numbers
Sanitize empty/NaN inputs to a default before createDate

When it happens

Trigger: Calling createDate(year, month, date) with date < 1 — e.g. date arithmetic like dayOfMonth - 1 producing 0 when computing the previous day, or parsing unvalidated user input containing 0.

Common situations: Naive previous-day calculation hitting day 0; empty or malformed form fields yielding 0; off-by-one errors in calendar grid generation.

Related errors

AI-assisted analysis of angular/components@0411926e7d (2026-08-31). Data as JSON: /api/errors/e00391729edc2498. Report an issue: GitHub.