What causes "Formats array must not be empty." in angular/components?

Ensure the array passed to parse contains at least one format string, e.g. `formats.length ? formats : ['yyyy-MM-dd']`.

Formats array must not be empty.

Error message

Formats array must not be empty.

What it means

The date-fns adapter's _parse method requires at least one parse format so it can attempt to interpret the user's input string as a date. The code builds a formats array from parseFormat, but the guard checks `!parseFormat.length` on the original input — so it throws when the input is an empty array (or when a string is passed, since strings also have `.length`... practically, an empty array input). Without any format the subsequent parse loop would do nothing and return null, so the library fails fast with this error instead.

Solutions

Ensure the array passed to parse contains at least one format string, e.g. `formats.length ? formats : ['yyyy-MM-dd']`.
Check your MAT_DATE_FORMATS parse.dateInput configuration — it must be a non-empty string or non-empty array.
If formats are computed dynamically, add a fallback default before calling parse.
Wrap the call in try/catch if input formats are user-supplied and cannot be pre-validated.

Example fix

// before
adapter.parse('2024-01-15', []);

// after
adapter.parse('2024-01-15', ['yyyy-MM-dd']);
// or guard:
const formats = userFormats.length ? userFormats : ['yyyy-MM-dd'];
adapter.parse('2024-01-15', formats);

Defensive patterns

Strategy: validation

Validate before calling

const formats: string | string[] = getConfiguredParseFormats();
const list = Array.isArray(formats) ? formats : [formats];
if (!list.length) throw new Error('parse requires at least one format');
adapter.parse(value, list);

Type guard

function hasFormats(f: string | string[]): f is string | [string, ...string[]] {
  return typeof f === 'string' ? f.length > 0 : f.length > 0;
}

Try / catch

try {
  return adapter.parse(value, formats);
} catch (e) {
  if (e.message.includes('Formats array must not be empty')) return null;
  throw e;
}

Prevention

Never pass an empty array to parse; use undefined to trigger the ISO-8601 fallback.
Keep a non-empty default format list in MAT_DATE_FORMATS.
When building format lists dynamically, always provide a fallback entry.
Validate config at app startup, not at parse time.

When it happens

Trigger: Calling `adapter.parse(value, [])` (empty array of formats), or indirectly from parseTime with an empty format array. Note the guard checks the raw input, so a non-empty string/array passes but an empty array throws.

Common situations: Passing a dateFormats config array that is built dynamically (e.g. filtered from user or locale settings) and ends up empty; passing `[]` as the MAT_DATE_FORMATS parse.dateInput; wiring parseTime with an empty formats list.

Related errors

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

Appendix: source

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

  private _parse(
    value: unknown,
    parseFormat: string | string[],
    shouldTryParseIso = true,
  ): Date | null {
    if (typeof value == 'string' && value.length > 0) {
      if (shouldTryParseIso) {
        const iso8601Date = parseISO(value);

        if (this.isValid(iso8601Date)) {
          return iso8601Date;
        }
      }

      const formats = Array.isArray(parseFormat) ? parseFormat : [parseFormat];

      if (!parseFormat.length) {
        throw Error('Formats array must not be empty.');
      }

      for (const currentFormat of formats) {
        const fromFormat = parse(value, currentFormat, new Date(), {locale: this.locale});

        if (this.isValid(fromFormat)) {
          return fromFormat;
        }
      }

      return this.invalid();
    } else if (typeof value === 'number') {
      return new Date(value);
    } else if (value instanceof Date) {
      return this.clone(value);
    }

    return null;

View on GitHub (pinned to 0411926e7d)