Угловой материал 7 Datepicker: отключить многолетнее представление
Я использую MatDatepicker из @angular/material ^7.0.0-rc.0, и я сделал небольшой сложный фильтр, который сравнивает каждый видимый день в средстве выбора времени с каждым днем массива с примерно 200 или 300 значениями. Это нарушает приложение каждый раз, когда я переключаю указатель даты в многолетний режим просмотра.
Я просто хочу отключить или запретить многолетний режим просмотра, и пусть работают только месячный режим и годовой режим.
HTML:
<mat-form-field (click)="picker.open()" class="date-field">
<span>{{(dataFields['mosaic_'+REPORT_STAGES.PLANTING]['value'] | date: 'dd/MM/yyyy') || 'Não plantou'}}</span>
<input matInput hidden [matDatepicker]="picker" placeholder="" [(value)]="dataFields['mosaic_'+REPORT_STAGES.PLANTING]['value']" (dateChange)="plantingDateChange($event)" [matDatepickerFilter]="datePickerFilter.bind(this)">
<mat-datepicker #picker></mat-datepicker>
</mat-form-field>
Мой метод фильтрации:
datePickerFilter(d: Date): boolean {
const dAsDate = this.datePipe.transform(d, 'dd-MM-yyyy');
const validDates = this.allowedDays.filter(e => {
const eAsDate = this.datePipe.transform(new Date(e), 'dd-MM-yyyy');
return eAsDate === dAsDate;
});
console.log(validDates);
return (validDates.length > 0);
}
Я не нашел ничего на А. Материал руководства, которое может мне помочь. Надеюсь, что кто-нибудь может!
Большое спасибо!
1 ответ
Вы можете передать настраиваемый компонент в качестве заголовка календаря, это позволит вам переопределить кнопку, позволяющую пользователю выбрать многолетний вид.
Этот пример не имеет возможности выбрать многолетний.
https://material.angular.io/components/datepicker/overview
HTML
ссылаться на пользовательский компонент на mat-datepicker
<mat-datepicker #picker [calendarHeaderComponent]="exampleHeader"></mat-datepicker>