PrimeNG - FullCalendar：无法访问 fullCalendar 方法答案

【问题标题】：PrimeNG - FullCalendar: cannot access fullCalendar methodsPrimeNG - FullCalendar：无法访问 fullCalendar 方法
【发布时间】：2019-11-14 23:08:50
【问题描述】：

我有一个 Angular 7 应用程序，我在其中使用 PrimeNG 和 FullCalendar 4 来显示和管理日程安排。为了删除一个事件，我向渲染的事件添加了一个自定义删除图标，并将其 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 和 Angular 生命周期挂钩 AfterViewInit。在他们两个中，FC 都被定义了，我可以访问getCalendar()，但是当从我自己的任何函数访问时，似乎在这个 FC 之外是未定义的。

【问题讨论】：

标签： angular typescript fullcalendar primeng fullcalendar-4

【解决方案1】：

经过更多的挖掘和测试，我发现我添加到图标的事件监听器是通过：

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

是问题所在。用 Angulars Renderer2 替换它为我解决了这个问题。

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

【讨论】：

我应该在哪里更换，请告诉我？我有同样的问题，但我不能使用这个解决方案