ERROR TypeError: Cannot read property 'helpers' of undefined

Question

Click here to view my codes

import { OnInit } from '@angular/core';
import { HelpersService } from 'src/app/helpers.service';

@Component({
  selector: 'app-system-maintenance',
  templateUrl: './system-maintenance.page.html',
  styleUrls: ['./system-maintenance.page.scss'],
})
export class SystemMaintenancePage implements OnInit {

constructor(
public helpers : HelpersService,


 ) {}

  calendarVisible = false;
  calendarOptions: CalendarOptions = {
    headerToolbar: {
      center: 'prev,today,next',
      left: 'title',
      right: 'dayGridMonth,timeGridWeek,timeGridDay',
    },
    initialView: 'dayGridMonth',
    // initialEvents: INITIAL_EVENTS,
    weekends: true,
    editable: true,
    nextDayThreshold: '00:00:00',
    events: [
      {
        // Goes from 8pm to 10am the next day.
        title: 'Event 2',
        start: '2020-12-04T00:00:00',
        end: '2020-12-06T00:00:01',
        allDay : true,
        html : true,
      }
    ],
    eventDidMount: function(info) {
      /// console.log(info);
    },

    eventDrop: function(info) {
      /// alert(info.event.title + " was dropped on " + info.event.start.toISOString() + ' to '+ info.event.end.toISOString());
      if (!confirm("Are you sure about this change?")) {
        info.revert();
      }else{
        this.helpers.update_sched(info.event);
      }
    },
    selectable: true,
    displayEventTime : true,
    selectMirror: true,
    // dayMaxEvents: true,
  };

我无法在 eventDrop 内的助手服务中使用我的函数，它说未定义。将事件拖放到特定日期后，它会显示“错误类型错误：无法读取未定义的属性 'helpers'”..

编辑：为我的问题添加了一些代码文本。

Answer 1

请清楚显示我将隔离您对您拥有的对象的定义，...

    eventDrop: function(info) { /* this is where your mistake is */
      /*
      with the keyword 'function', this refers to the function object from JS, so
      to fix it you need to change to arrow function...
      */
      if (!confirm("Are you sure about this change?")) {
        info.revert();
      } else{
        this.helpers.update_sched(info.event);
      }
    },

所以在箭头函数中它看起来像这样。

eventDrop: (info) => { /* this is where your mistake is */
      /*
      with the keyword 'function', this refers to the function object from JS, so
      to fix it you need to change to arrow function...
      */
      if (!confirm("Are you sure about this change?")) {
        info.revert();
      } else{
        this.helpers.update_sched(info.event);
      }
    },

ERROR TypeError: Cannot read property 'helpers' of undefined

ERROR TypeError: Cannot read property 'helpers' of undefined

fullcalendar

typescript

ionic-framework

angular