Angular: NG02100: InvalidPipeArgument: 'Unable to convert "x" into a date' for pipe 'DatePipe'
The date pipe was given a value it cannot turn into a Date — an invalid string, a non-ISO format, null handled wrongly or a string locale format.
Unable to convert into a date for pipe 'DatePipe'InvalidPipeArgument: 'Unable to convert "x" into a date' for pipe 'DatePipe'for pipe 'DatePipe'NG02100 DatePipeInvalidPipeArgument: for pipe 'DatePipe' Meaning
DatePipe accepts a Date, a number (ms), or an ISO 8601 string. Formats like 13/05/2024 or 2024-13-05 fail. Convert on input with new Date(...), a date library, or fix the API to send ISO strings. null/undefined returns an empty string, but invalid text throws.
Common causes
- Date string in a non-ISO format (
dd/MM/yyyy) - Invalid value ("N/A", empty string with whitespace)
- Epoch in seconds instead of milliseconds producing a wrong date
- Time zone or locale issues in string parsing
- Value is an object that is not a Date
⚡ Quick fix
- Convert to
Dateor ISO in the component/service - Validate or default invalid values before the pipe
- Send ISO 8601 strings from the API
Detailed fix by platform
Angular
{{ createdAt | date:'medium' }}withcreatedAtas an ISO string or Date- Convert seconds:
new Date(seconds * 1000)
Code examples
Normalise before the pipe
const raw = '13/05/2024'; // not ISO: DatePipe throws
const [d, m, y] = raw.split('/').map(Number);
this.created = new Date(y, m - 1, d); // Date object works with | dateHow to diagnose
- Value — Exact value passed to the pipe?
- Format — ISO 8601, ms or Date?
- Source — API or user input?
🔧 Still not fixed?
Many errors look alike. If the steps above didn’t solve it, one of these is probably what you’re facing:
Similar errors
- Cannot find control with name Angular: Error: Cannot find control with name: 'email' (reactive forms)
- Could not find the builder's node package Angular CLI: Could not find the '@angular-devkit/build-angular:browser' builder's node package / Cannot find module '@angular-devkit/build-angular/package.json'
- exceeded maximum budget Angular build: Error: bundle initial exceeded maximum budget. Budget 1.00 MB was not met by 120.00 kB with a total of 1.12 MB
Most viewed in Angular
Other ways to find it
Where this error sits
Origin: On your device. Errors that are often confused with or caused by this one (click to open):
🧠 Still stuck? Analyze your error
Paste the full message, response headers or stack trace — we'll detect the platform and point to the most likely cause.
💬 What worked for others
No tips yet — did something else fix this for you?
Share what worked for you
Tips are checked by an editor before they appear. Links are removed.
Report a correction or suggest an improvement
Last updated 15 Oct 2026