PrimeNG - FullCalendar:无法访问fullCalendar方法

Question

我有一个角7应用程序，在其中我使用PrimeNG和FullCalendar 4来显示和管理一天的时间表。要删除一个事件，我向呈现的事件添加了一个自定义的delete图标，并将其onClick事件绑定到我的onEventDeleteClicked函数。

根据PrimeNG文档，我为日历添加了一个ViewChild来访问它的方法(下面的代码)。

https://www.primefaces.org/primeng/#/fullcalendar

component.ts ViewChild和onEventDeleteClicked

@ViewChild('daySchedule') fc: FullCalendar;

public onEventDeleteClicked(event: Event): void {
    // Delete selected Event
    const calendar = this.fc.getCalendar();
    console.log(event);
}

component.html

<div class="calendar-container">
    <p-fullCalendar #daySchedule [events]="events" [options]="options"></p-fullCalendar>
</div>

但是，当我试图在方法中调用"const calendar = this.fc.getCalendar();"时，我得到了Error: "Cannot get getCalendar of undefined"

我在fullCalendars自己的回调(如eventRender和角生命周期挂钩AfterViewInit )中进行了检查。在这两个函数中，FC都是定义的，我可以访问getCalendar()，但是当从我自己的任何函数访问时，似乎没有定义这个FC之外的功能。

Answer 1

经过进一步的挖掘和测试，我发现我通过以下方式添加到图标中的事件侦听器：

element.addEventListener('click', this.onEventDropped, false);

是问题所在。用Angulars Renderer2代替它，帮我解决了这个问题。

this.renderer.listen(element, 'click', (dropEvent: any) => {
          this.onEventDropped(dropEvent);
        });