angular - 在 ngAfterViewInit 事件上更新日历标题后，fullCalendar 单击事件不起作用

Question

我已经在 Angular 应用程序中实现了 FullCalendar，并在完整日历中绑定了一些事件。我需要在按钮单击时使用新数据更新日历事件并显示 Day1、Day2、Day3... 代替 Mon、Tues、Wed... 所以我已成功设置 Day1、Day2... 代替 Mon，星期二...关于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>

全日历 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);
    }    
}

可能是什么问题？

标签： angularangular6fullcalendarangular-lifecycle-hooks