我通过执行以下操作为mat-datepicker
创建了自定义日期:
export const PICK_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'}
}
};
class PickDateAdapter extends NativeDateAdapter {
format(date: Date, displayFormat: Object): string {
if (displayFormat === 'input') {
return formatDate(date,'dd-MMM-yyyy',this.locale);;
} else {
return date.toDateString();
}
}
}
@Component({
...
providers: [
{ provide: DateAdapter, useClass: PickDateAdapter },
{ provide: MAT_DATE_FORMATS, useValue: PICK_FORMATS }
]
})
我遇到的问题是,我的视图中有多个日期选择器,但是我只想将此过滤器应用于其中的一个,这就是我遇到的问题。我认为我必须将单个元素提供给提供程序,但是我不确定是否确实如此,或者我确实不知道该怎么做。
MatDatePicker注入DateAdapter和MAT_DATE_FORMATS以在组件中使用。因此,它将使用您的组件中提供的那些。如果只想在一个组件中使用它们:我看到的唯一解决方案是将其包装在提供这些自定义实现的指令中。