1

角度アプリに FullCalendar を実装し、いくつかのイベントを完全なカレンダーにバインドしました。ボタンをクリックして新しいデータでカレンダーイベントを更新する必要があり、月、火、水...の代わりにDay1、Day2、Day3...を表示する必要があるため、月の代わりにDay1、Day2...を正常に設定しました。火...ngAfterViewInit()角度のイベントで。しかし、カレンダーの日付のクリックイベントはその後機能しません。また、カレンダーのイベントを新しいデータで更新していません

フルカレンダー HTML コード:

  <full-calendar #calendar defaultView="dayGridMonth" [header]="{
      left: 'title',
      right: 'prev,next today'
    }" [plugins]="calendarPlugins" [weekends]="calendarWeekends" [events]="eventswithcount"
(dateClick)="redirectToNext($event)" (dayRender)="dayRendered($event)" (eventClick)="redirectToNext($event)"
[showNonCurrentDates]="false" [defaultDate]="this.date" [fixedWeekCount]="false"></full-calendar>

fullcalendar ts コード:

@ViewChild('calendar') calendarComponent: FullCalendarComponent = <FullCalendarComponent>{}; // the #calendar in the template

ngAfterViewInit() {
    if (!this.viewFlag)//for stp to show Day 1 in behalf of sunday
    {
        let calendarApi = this.calendarComponent.getApi();
        if (calendarApi != undefined) {
            calendarApi.el.innerHTML=calendarApi.el.innerHTML.replace('<span>Sun</span>','<span>Day 1</span>');
            calendarApi.el.innerHTML=calendarApi.el.innerHTML.replace('<span>Mon</span>','<span>Day 2</span>');
            calendarApi.el.innerHTML=calendarApi.el.innerHTML.replace('<span>Tue</span>','<span>Day 3</span>');
            calendarApi.el.innerHTML=calendarApi.el.innerHTML.replace('<span>Wed</span>','<span>Day 4</span>');
            calendarApi.el.innerHTML=calendarApi.el.innerHTML.replace('<span>Thu</span>','<span>Day 5</span>');
            calendarApi.el.innerHTML=calendarApi.el.innerHTML.replace('<span>Fri</span>','<span>Day 6</span>');
            calendarApi.el.innerHTML=calendarApi.el.innerHTML.replace('<span>Sat</span>','<span>Day 7</span>');
        }
    }
}

redirectToNext(event: any) {
    let eventDate = event.date != undefined ? event.date : event.event.start;
    let datestr = moment(eventDate).format('YYYY-MM-DD');
    if (eventDate.getMonth() + 1 == this.date.split('-')[1]) {
        this.dateClick.emit(datestr);
    }    
}

何が問題になる可能性がありますか?

4

0 に答える 0