fullcalendar angular - updating database on eventDrop and eventResize

I have setup fullcalendar in an angular project, and have successfully pulled data from my api to populate the events:

@Component({
  selector: 'app-installboard',
  templateUrl: './installboard.component.html',
  styleUrls: ['./installboard.component.scss']
})
export class InstallboardComponent implements OnInit {

  appointments: any = [];

  constructor(private appointmentService: AppointmentService) { }

  ngOnInit(): void {
    this.pullAppointments();
  }

  public pullAppointments() {
    this.appointmentService.getInstallBoardAppointments().subscribe(data => {
      // logic for processing data into events array //
      this.renderCalendar();
    });
  }

Where I run into trouble is here. I have eventDrop and eventResize added to the calendar but I am very confused with the scopes of their callback functions? I would like to be able to make a call to my service and pass parameters in to create an api call back to the database and save the updates.

I have tried making calls to the service, as well as to public functions within the component but all throw typescript errors saying the functions don't exist.

  public renderCalendar() {
    var calendarEl = document.getElementById('calendar');

    var calendar = new Calendar(calendarEl, {
      plugins: [dayGridPlugin, timeGridPlugin, listPlugin, interactionPlugin, bootstrapPlugin],
      editable: true,
      themeSystem: 'bootstrap',
      header: { center: 'dayGridMonth, timeGridWeek, list' },
      timeZone: 'UTC',
      businessHours: {
        daysOfWeek: [1, 2, 3, 4, 5],
        startTime: '08:30',
        endTime: '17:00'
      },
      slotDuration: '00:15:00',
      slotLabelInterval: '01:00',
      scrollTime: '08:00:00',
      hiddenDays: [0],
      eventSources: this.appointments,
      eventDrop: function(info) {
        console.log(info.event.id);
        console.log(info.event.start);
        console.log(info.event.end);
        this.appointmentService.updateInstallBoardAppointments(info);
      },
      eventResize: function(info) {
        alert('it changed');
      }
    });

    calendar.render();
  }