I am working on a project which runs on Spring boot + Angular4. I use Angular material datepicker components (from official angular material site)
When I run ng serve
everything works fine I can select date and bind into Date property without any problem.
But when I try production version (usingng build --prod
and ng serve --prod
), my datepickers dont work and it looks like
this
Console says (full error)
`Cannot convert undefined or null to object
at new DateTimeFormat (native)`
My code:
<md-input-container>
<input mdInput (keypress)="$event.preventDefault()" (click)="dateTo.open()" [(ngModel)]="dateToValue" [mdDatepicker]="dateTo" placeholder="To">
<md-datepicker-toggle mdSuffix [for]="dateTo"></md-datepicker-toggle>
</md-input-container>
<md-datepicker #dateTo ></md-datepicker>
My app.module.ts
import { MaterialModule, MdDialogModule, MdDatepickerModule, MdNativeDateModule, MdInputModule } from '@angular/material';
I use @angular/material@2.0.0-beta.8. and @angular/cdk@2.0.0-beta.8.
I tried to install newer versions (@2.0.0-beta.12) and change code following official GitHub site examples and breaking changes , but still the same.
I also tried it without ngModel property , run in many browsers but nothing changed. I just cant understand why --prod
crashes my datepickers and works fine in ng serve
So finally after many many hours I found solution for my problem!
I installed the newest version of @angular/material@2.0.0-beta.12 again and all what has to be done was insert these lines of code in your MaterialComponents.module
(or your specific name) :
export class MaterialComponentsModule {
constructor(private dateAdapter: DateAdapter<Date>) {
dateAdapter.setLocale("sk-SK");
}
}
In my opinion in development version it was not necessary becasue of inserting some value by default, but in production version it didn't happend. Maybe it could be caused by using ngx-translate
library without setting default language or something other.
But now , everything works as expected :)