Angular7 fullcalendar v5 datesSet 回调未触发

Question

我在我的 Angular 7 项目中使用 angular 完整日历 (v5.3) 组件，我想在用户更改视图日期时触发一个事件（当在两者之间导航时日期）这是我的日历选项的样子，除了显示数据外，此日历与用户之间没有交互。

 @ViewChild('calendar') calendarComponent: FullCalendarComponent;
  calendarOptions: CalendarOptions = {
    headerToolbar: {
      left: 'prev,next today',
      center: 'title',
      right: 'dayGridMonth,timeGridWeek,timeGridDay'
    },
    initialView: 'timeGridWeek',
    weekends: true,
    editable: false,
    selectable: false,
    selectMirror: false,
    dayMaxEvents: true,
    nowIndicator: true,
    allDaySlot: false,
    eventSources: [ ],
  };

html 页

<div>
      <full-calendar (datesSet)="handleDates($event)" defaultView="dayGridMonth" [options]="calendarOptions"></full-calendar> 
</div>

事件处理器函数

 handleDates(args:any){    
    var startDate = args.view.activeStart;
    var endDate = args.view.activeEnd;
    if(endDate > this.periodEndDate){
      this.periodStartDate = new Date(endDate.getFullYear(),endDate.getMonth()-1, 1);
      this.periodEndDate = new Date(startDate,startDate.getMonth() + 2, 0);
    } else if(startDate < this.periodEndDate){
      this.periodStartDate = new Date(startDate.getFullYear(),endDate.getMonth()-1, 1);
      this.periodEndDate = new Date(endDate,endDate.getMonth() + 2, 0);
    }        
   //this method loads event data from the API;
    this.refreshCalendarData(this.periodStartDate, this.periodEndDate);
  }

不知为何这个 handleDates(args:any) 没有触发。

代码中有没有可以看出的问题？基本上，我想加载某个日期范围内的数据，并在用户从 UI.

更改日期时更改它

Answer 1

已找到解决方案，我以错误的方式使用了回调。 datesSet 应包含在日历选项中并绑定到如下方法

  @ViewChild('calendar') calendarComponent: FullCalendarComponent;
  calendarOptions: CalendarOptions = {
    headerToolbar: {
      left: 'prev,next today',
      center: 'title',
      right: 'dayGridMonth,timeGridWeek,timeGridDay'
    },
    initialView: 'timeGridWeek',
    weekends: true,
    editable: true,
    selectable: true,
    selectMirror: false,
    dayMaxEvents: true,
    nowIndicator: true,
    allDaySlot: false,
    datesSet: this.handleDates.bind(this),
    eventSources: [ ],
  };

Angular7 fullcalendar v5 datesSet 回调未触发

Angular7 fullcalendar v5 datesSet callback is not triggering

javascript

fullcalendar

angular