首页 > 解决方案 > 从 customButton fullcalendar 调用函数

问题描述

我添加了一个自定义按钮到我的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>

标签: javascriptangulartypescriptfullcalendar

解决方案


From the fullcalendar documentation:

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

You can see that there is an issue in your custom button declaration for the click() property.

I'm suprised you still have the error referencing this.openModal. Since you stated you tried click: this.openModal, I would suggest you to give a shot to click : () => console.log('clicked'). If it works, the problem might come from usage of this.


推荐阅读