PrimeNG Schedule 未显示的事件无法读取 null 的属性 scrollTop答案

【问题标题】：Events not displaying with PrimeNG Schedule cannot read property scrollTop of nullPrimeNG Schedule 未显示的事件无法读取 null 的属性 scrollTop
【发布时间】：2023-04-10 13:54:02
【问题描述】：

我正在尝试使用 PrimeNG 的日程安排组件为用户显示日历事件。日历显示，但是当 Fullcalendar 尝试呈现事件时，它返回错误：
"ORIGINAL EXCEPTION: TypeError: Cannot read property 'scrollTop' of null"
事件应该是正确的格式，因为该项目只是从已经使用 Fullcalendar 的 angular1 版本重构。下面我包含了 html、配置选项和试图显示的事件的模拟。

template.html

        <p-schedule id="calendar" class="calendar" [events]="calendar.sources" 
            [calendar]="myCalendar1" [height]="calendar.config.height"
            [header]="calendar.config.header" [editable]="calendar.config.editable"
            [weekends]="calendar.config.weekends" [eventLimit]="calendar.config.eventLimit"
            (onDayClick)="calendar.config.dayClick" (onEventClick)="calendar.config.eventClick"
            (onEventDrop)="calendar.config.eventDrop">
        </p-schedule>

this.calendar.config = {
  height: 900,
  editable: true,
  weekends: true,
  eventLimit: true,
  header: {
    left: 'agendaDay,agendaWeek,month',
    center: 'title',
    right: 'today prev,next'
  },
  dayClick: this.dayClick,
  eventClick: this.eventClick,
  eventDrop: this.stopDrag
}

事实证明，无论我包含什么选项，fullcalendar 总是给出相同的错误。我什至尝试加载没有选项的计划模板，但仍然有同样的错误。这似乎表明我包含 Schedule 和 fullcalendar 的方式不正确。我通过 npm install --save 包含了primeng 和 moment，然后通过 html cdns 包含了 fullcalendar。我遵循了here 所示的实现更改让 Schedule 启动并运行。然后，我将 Schedule 添加为我当前组件的提供者和指令。 Schedule 也包含在我的类构造函数中，以便我可以从组件的方法中引用它。

【问题讨论】：

标签： angular schedule angular-cli primeng fullcalendar-scheduler

【解决方案1】：

事实证明，JQuery 3.0.0 的更新与 Fullcalendar 不兼容。通过将 JQuery 回滚到 2.2.4，一切正常。

【讨论】：

【解决方案2】：

我对 fullcalendar 也有同样的问题，Isahiro 的回答就是解决方案。我只是想补充一下，我的发生是因为与 bower 的依赖冲突将 jquery 升级到了我的 3.x。您可以通过将以下内容添加到 bower.json 来强制 bower 使用 2.x 版本。

"resolutions": {
   "jquery": "~2.1.4"
}

【讨论】：