Angular 更新ngAfterViewInit事件上的日历标题后，fullCalendar click事件不起作用

我已经在angular应用程序中实现了FullCalendar，并在FullCalendar中绑定了一些事件。我有更新的按钮点击加上显示第1天，第2天，第3天新数据日历事件的要求。。。代替周一、周二、周三。。。所以我成功地设置了第一天，第二天。。。代替周一、周二。。。在

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);
    }    
}

@ViewChild（'calendar'）日历组件：FullCalendarComponent={}；//模板中的#日历
ngAfterViewInit（）{
if（！this.viewFlag）//用于stp代表星期日显示第1天
{
让calendarApi=this.calendarComponent.getApi（）；
如果（calendarApi！=未定义）{
calendarApi.el.innerHTML=calendarApi.el.innerHTML.replace（'Sun'，'Day 1'）；
calendarApi.el.innerHTML=calendarApi.el.innerHTML.replace（'Mon'，'Day 2'）；
calendarApi.el.innerHTML=calendarApi.el.innerHTML.replace（'Tue'，'Day 3'）；
calendarApi.el.innerHTML=calendarApi.el.innerHTML.replace（'Wed'，'Day 4'）；
calendarApi.el.innerHTML=calendarApi.el.innerHTML.replace（'Thu'，'Day 5'）；
calendarApi.el.innerHTML=calendarApi.el.innerHTML.replace（'Fri'，'Day 6'）；
calendarApi.el.innerHTML=calendarApi.el.innerHTML.replace（'Sat'，'Day 7'）；
}
}
}
重定向到下一个（事件：任意）{
让eventDate=event.date！=未定义？event.date:event.event.start；
设datestr=时刻（eventDate）.format（'YYYY-MM-DD'）；
如果（eventDate.getMonth（）+1==this.date.split（'-'）[1]）{
this.dateClick.emit（datestr）；
}    
}

---

有什么问题吗？

不确定这里是否有足够的代码用于可复制的示例（我不是一个有棱角的用户），但我猜您已经替换了fullCalendar附加了事件处理程序的某些元素。由于新添加的HTML没有附加任何事件处理程序，因此不会触发任何事件。但是，如果您想控制列标题中的文本（我假设这就是您正在做的，尽管它不是100%清楚），那么您可以使用内置选项。与直接覆盖日历HTML相比，使用它不太可能搞乱任何事情。不确定这里是否有足够的代码用于可复制的示例（我不是一个有棱角的用户），但我猜您已经替换了fullCalendar附加了事件处理程序的某些元素。由于新添加的HTML没有附加任何事件处理程序，因此不会触发任何事件。但是，如果您想控制列标题中的文本（我假设这就是您正在做的，尽管它不是100%清楚），那么您可以使用内置选项。与直接覆盖日历HTML相比，使用它不太可能搞乱一切。