1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91
|
import { BrowserModule } from '@angular/platform-browser';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { NoopAnimationsModule } from '@angular/platform-browser/animations';
import { MatCheckboxModule } from '@angular/material/checkbox';
import { MatRadioModule } from '@angular/material/radio';
import { MatSelectModule } from '@angular/material/select';
import { NgModule } from '@angular/core';
import { MatInputModule } from '@angular/material/input';
import { AppComponent } from './app.component';
import { FormsModule } from '@angular/forms';
//DATE PICKER
// Custom DateAdapter
import {MatDatepickerModule, MatNativeDateModule, NativeDateAdapter, DateAdapter, MAT_DATE_FORMATS,MAT_DATE_LOCALE} from '@angular/material';
// extend NativeDateAdapter's format method to specify the date format.
export class CustoMatateAdapter extends NativeDateAdapter {
format(date: Date, displayFormat: Object): string {
if (displayFormat === 'input') {
const day = date.getUTCDate();
const month = date.getUTCMonth() + 1;
const year = date.getFullYear();
// Return the format as per your requirement
return `${year}-${month}-${day}`;
} else {
return date.toDateString();
}
}
// If required extend other NativeDateAdapter methods.
}
const MY_DATE_FORMATS = {
parse: {
dateInput: { month: 'short', year: 'numeric', day: 'numeric' }
},
display: {
dateInput: 'input',
monthYearLabel: { year: 'numeric', month: 'short' },
dateA11yLabel: { year: 'numeric', month: 'long', day: 'numeric' },
monthYearA11yLabel: { year: 'numeric', month: 'long' },
}
};
@NgModule({
declarations: [
],
imports: [
BrowserModule,
BrowserAnimationsModule,
MatCheckboxModule,
MatRadioModule,
MatSelectModule, //nécessite form module !
FormsModule,
MatInputModule,
MatDatepickerModule,
MatNativeDateModule,
],
exports: [
BrowserModule,
BrowserAnimationsModule,
MatCheckboxModule,
MatRadioModule,
MatSelectModule, //nécessite form module !
FormsModule,
MatInputModule,
MatDatepickerModule,
MatNativeDateModule,
],
providers: [
{
provide: DateAdapter, useClass: CustoMatateAdapter
},
{
provide: MAT_DATE_FORMATS, useValue: MY_DATE_FORMATS
},
{
provide: MAT_DATE_LOCALE, useValue: 'fr'
},
]
})
export class MaterialModule { } |
Partager