Angular-Calendar:没有日期适配器提供程序

时间:2019-06-12 12:52:58

标签: angular angular-calendar

在我新创建的Angular应用中,我试图使用mattlewis92的angular-calendar来创建他的日历。我已复制了他的github上列出的所有步骤和代码:https://mattlewis92.github.io/angular-calendar/#/kitchen-sink,但我不断收到一条错误消息,内容为Error: StaticInjectorError(AppModule)[CalendarDayViewComponent -> Date Adapter]: NullInjectorError: No provider for DateAdapter!

在我的app.module.ts中,我有这个,并且还全部导入了它们:

imports: [
    CalendarModule.forRoot({
        provide: DateAdapter,
        useFactory: adapterFactory
    })
]

我唯一看到的问题是我也使用Moment,因此我在提供程序中拥有了它:

{ provide: DateAdapter, useClass: MomentDateAdapter, deps: [MAT_DATE_LOCALE] }

非常感谢您提供帮助,以了解为什么会发生这种情况或我将如何解决它,谢谢!

2 个答案:

答案 0 :(得分:1)

尝试一下。为我工作。日历需要某种形式的dateAdapter,如下所示。

import { CalendarModule, DateAdapter } from 'angular-calendar';
import { adapterFactory } from 'angular-calendar/date-adapters/moment';
import * as moment from 'moment';

export function momentAdapterFactory() {
  return adapterFactory(moment);
};
imports: [
    CalendarModule.forRoot({ provide: DateAdapter, useFactory: momentAdapterFactory })
]

答案 1 :(得分:0)

我猜您正在混合使用DateAdapter符号。

在您的日历模块中,使用:

import { DateAdapter } from "angular-calendar";

在角材模块中,使用:

import { DateAdapter } from '@angular/material/core';

第二,如果要在date-fns中使用angular-calendar,则当前代码应该没问题。如果要在力矩中使用角度日历,则应参考此official demo

日历模块如下所示:

export function momentAdapterFactory() {
  return adapterFactory(moment);
}

@NgModule({
  imports: [
    CommonModule,
    CalendarModule.forRoot(
      {
        provide: DateAdapter,
        useFactory: momentAdapterFactory,
      },
      {
        dateFormatter: {
          provide: CalendarDateFormatter,
          useClass: CalendarMomentDateFormatter,
        },
      }
    )
  ],
  providers: [
    {
      provide: MOMENT,
      useValue: moment,
    },
  ],
})
export class MyCalendarModule {}