仅在组件级别使用 Angular Material MomentDateAdapter

Question

我的应用程序中有多个组件使用了 mat-datepicker。但在其中一个中，我想使用 MomentDateAdapter。问题是当我在一个组件中提供它时它会影响所有其他组件。

@Component({
 selector: 'my-moment-mat-date-picker',
 templateUrl: './my-moment-mat-date-picker.component.html',
 styleUrls: ['./my-moment-mat-date-picker.component.scss'],
 providers: [
 // `MomentDateAdapter` can be automatically provided by importing `MomentDateModule` in your
 // application's root module. We provide it at the component level here, due to limitations of
 // our example generation script.
{
  provide: DateAdapter,
  useClass: MomentDateAdapter,
  deps: [MAT_DATE_LOCALE, MAT_MOMENT_DATE_ADAPTER_OPTIONS],
},

 { provide: MAT_DATE_FORMATS, useValue: MY_FORMATS },
],
})

和

import {
 MAT_MOMENT_DATE_ADAPTER_OPTIONS,
 MomentDateAdapter,
 }  from '@angular/material-moment-adapter';
import {
 DateAdapter,
 MAT_DATE_FORMATS,
 MAT_DATE_LOCALE,
} from '@angular/material/core';
import * as _moment from 'moment';
// tslint:disable-next-line:no-duplicate-imports
import { default as _rollupMoment } from 'moment';
const moment = _rollupMoment || _moment;
export const MY_FORMATS = {
parse: {
 dateInput: 'LL',
},
display: {
  dateInput: 'LL',
   monthYearLabel: 'MMM YYYY',
  dateA11yLabel: 'LL',
  monthYearA11yLabel: 'MMMM YYYY',
},
};

Answer 1

问题是我在我的组件模块中导入了 import { MatMomentDateModule } from "@angular/material-moment-adapter"，然后在共享模块中导入了这个模块。

仅在组件级别使用 Angular Material MomentDateAdapter

use Angular Material MomentDateAdapter only in component level

javascript

angular

angular-material

momentjs

angular-moment