想要在 fullcalendar 上展示活动

Question

I use fullcalendar-Angular ( angular 11, fullcalendar 5.5.0 ).

But I cannot retrieve events to show on the calendar.

I retrieve events in the picture below:

https://i.stack.imgur.com/UdAGJ.png

This is the fetch code.

   
   this.Studio.getStudioCalendar().subscribe(data => {
        data["data"].map((list) => {
              this.eventDateSet.push(list);
           });
           this.calendarOptions;
           console.log("calendar data :",this.eventDateSet)
           console.log("calendarOptions  :",this.calendarOptions)
   })
 } 

This is the libar FullCalendar's code.

    dateClick: this.handleDateClick.bind(this),
    headerToolbar: {
      left: "prev,next today",
      center: "title",
      right: "dayGridMonth,timeGridWeek,timeGridDay,listWeek,prevYear,nextYear",
    },
    initialView: "dayGridMonth",
    weekends: true,
    editable: true,
    selectable: true,
    selectMirror: true,
    dayMaxEvents: true,
    dayHeaderFormat: {
      weekday: "short",
      month: "numeric",
      day: "numeric",
      omitCommas: true,
    },
    buttonText: {
      today: "วันนี้",
      month: "เดือน",
      week: "สัปดาห์",
      day: "วัน",
      list: "กำหนดการ",
    },
    locale: "th",
   events: [this.eventDateSet],
  }; 

Answer 1

You might wanna try with the initialEvents property of your CalendarOptions .

Also, your events should be of type EventInput which doesn't contain a dateStart or dateEnd property but just start and end .