Angular Material 10 range datepicker and moment.js Error: date.getFullYear is not a function

Question

Essayer d'implémenter Angular Material v10 datepicker avec l'option rangePicker avec moment.js Mais quand j'utilise moment en combinaison avec le rangePicker, cela me donne cette erreur.

Error: date.getFullYear is not a function

Cette erreur se produit lorsque j'essaie de sélectionner la deuxième datematEndDate

Exemple modifié de Google Stackblitz montrant l'erreur :

https://stackblitz.com/edit/angular-imb7gg?file=src/app/datepicker-moment-example.ts

Answer 1

Le sélecteur de date de plage utilise une stratégie de plage avec le mauvais DateAdapter.

Afin de résoudre ce problème, vous devez fournir un MAT_DATE_RANGE_SELECTION_STRATEGYjeton au même niveau que celui où vous avez fourni customDateAdapter :

import {
  MAT_DATE_RANGE_SELECTION_STRATEGY,
  DefaultMatCalendarRangeStrategy
} from '@angular/material/datepicker';
...
providers: [
 { provide: MAT_DATE_RANGE_SELECTION_STRATEGY, useClass: DefaultMatCalendarRangeStrategy},
 { provide: DateAdapter, useClass: MomentDateAdapter, deps: [MAT_DATE_LOCALE]},
 ....

Il s'assure que DefaultMatCalendarRangeStrategyla classe obtiendra MomentDateAdapter comme DateAdapterimplémentation au lieu deNativeDateAdapter

Stackblitz fourchu