来自CustomButton FullCalendar的呼叫功能

Question

我在我的 fullcalendar中添加了一个自定义按钮：

ngOnInit() {
this.calendarOptions = {
  customButtons: {
    custom1: {
      text: 'Add event',
      click() {
        this.openModal();
     }
    }
  },
  height: 600,
  editable: true,
  eventLimit: false,
  locale: 'lt',
  header: {
    left: 'prev,next today, custom1,custom2',
    center: 'title',
    right: 'month,agendaWeek,agendaDay,listMonth'
  },
  events: ''
};}

和按钮单击我要调用函数：

    openModal() {
console.log('opened');
// '<app-add-event></app-add-event>';}

但是，我得到错误 zone.js:199 Uncaught TypeError: this.openModal is not a function at HTMLButtonElement.click (events-calendar.component.ts:20)

我不知道怎么了。您如何调用自定义功能？

我也尝试了：

 this.calendarOptions = {
  customButtons: {
    custom1: {
      text: 'Pridėti įvykį',
      click:
        this.openModal
    }
  }, ...   };

在这种情况下，console.log();工作，但此后我仍然会遇到以下错误。这里怎么了？

我应该在此处声明此功能吗？

<ng-fullcalendar #ucCalendar [options]="calendarOptions" (eventClick)="eventClick($event.detail)" (eventDrop)="updateEvent($event.detail)"
          (eventResize)="updateEvent($event.detail)" (clickButton)="clickButton($event.detail)"></ng-fullcalendar>

Answer 1

来自FullCalendar文档：

  customButtons: {
    myCustomButton: {
      text: 'custom!',
      click: function() {
        alert('clicked the custom button!');
      }
    }
  }

您可以看到click()属性的自定义按钮声明中存在问题。

我感到惊讶，您仍然有引用this.openModal的错误。由于您说您尝试了click: this.openModal，因此我建议您向click : () => console.log('clicked')拍摄。如果有效，问题可能来自this的使用。

Answer 2

使用胖箭头功能，例如：

this.calendarOptions = {
  customButtons: {
    custom1: {
      text: 'Add event',
      click: () => this.openModal()
    }
  }
}