如何使用fullcalendar for Angular 7 cli捕捉下一个、上一个、今天的事件

我正在Angular 7应用程序中实现fullCalendar，日历正在运行，我正在将一些事件导入其中，但我正在尝试更有效地实现它，我正在尝试只带来日历需要的事件

所以。。我有一些问题

---

如何在“上一页”、“下一页”或“今天”按钮中获取单击事件

---

如何获取当前日期

---

我一直在检查文件。。。但是只有jquery的例子

在这里我复制我的HTML

  <full-calendar id="calendar" *ngIf="options" #fullcalendar [editable]="true" [events]="citas"
    [header]="options.header" [locale]="options.locale" [customButtons]="options.customButtons"
    (dateClick)="dateClick($event)" [plugins]="options.plugins" (eventClick)="eventClick($event)" [eventLimit]="4">
  </full-calendar>

根据插件，您可以访问基础

日历
对象以获取原始数据和方法：

const calendarApi = this.calendarComponent.getApi();

可在此处找到日期导航方法的完整列表：

因此，要获取当前日期，我们可以使用：
calendarApi.getDate（）

以下代码应该可以工作：

export class AppComponent {

  // references the #calendar in the template
  @ViewChild('calendar') calendarComponent: FullCalendarComponent;


  someMethod() {
    const calendarApi = this.calendarComponent.getApi();
    const currentDate = calendarApi.getDate();
    console.log("The current date of the calendar is " + currentDate);
  }
  
}

我还没有找到为prev和next按钮发出的任何事件，但是您可以使用
calendar.prev（）
和
calendar.next（）
方法构建自己的按钮

  goPrev() {
    const calendarApi = this.calendarComponent.getApi();
    calendarApi.next(); // call a method on the Calendar object
  }

根据插件，您可以访问基础
日历
对象以获取原始数据和方法：

const calendarApi = this.calendarComponent.getApi();

可在此处找到日期导航方法的完整列表：

因此，要获取当前日期，我们可以使用：
calendarApi.getDate（）

以下代码应该可以工作：

export class AppComponent {

  // references the #calendar in the template
  @ViewChild('calendar') calendarComponent: FullCalendarComponent;


  someMethod() {
    const calendarApi = this.calendarComponent.getApi();
    const currentDate = calendarApi.getDate();
    console.log("The current date of the calendar is " + currentDate);
  }
  
}

我还没有找到为prev和next按钮发出的任何事件，但是您可以使用
calendar.prev（）
和
calendar.next（）
方法构建自己的按钮

  goPrev() {
    const calendarApi = this.calendarComponent.getApi();
    calendarApi.next(); // call a method on the Calendar object
  }

我现在迟到了，但我想和你分享我的解决方案，所以：
在calendarOptions中，可以添加customButtons属性，然后将newNextFunct添加到fullCalendar函数，如下所示：

自定义按钮：{
下一步：{
单击：this.nextMonth.bind（this），
},
上一页：{
单击：this.prevMonth.bind（this），
},
今天：{
文字：“奥朱尔德回族”，
单击：this.currentmount.bind（this），
},
},

名为nextMonth的新NextFunction必须如下所示：

nextMonth（）：无效{
控制台警告（“下个月”）；
this.calendarApi=this.calendarComponent.getApi（）；
this.calendarApi.next（）；
}
我现在迟到了，但我想与您分享我的解决方案，因此：
在calendarOptions中，可以添加customButtons属性，然后将newNextFunct添加到fullCalendar函数，如下所示：

自定义按钮：{
下一步：{
单击：this.nextMonth.bind（this），
},
上一页：{
单击：this.prevMonth.bind（this），
},
今天：{
文字：“奥朱尔德回族”，
单击：this.currentmount.bind（this），
},
},

名为nextMonth的新NextFunction必须如下所示：

nextMonth（）：无效{
控制台警告（“下个月”）；
this.calendarApi=this.calendarComponent.getApi（）；
this.calendarApi.next（）；
}
“如何在“上一个”、“下一个”或“今天”按钮中获取单击事件？”…在fullCalendar中没有对此的回调，因为预计您不需要处理这些单击。您必须编写自己的事件处理代码并将其附加到这些元素。但你为什么要这么做？单击这些按钮时，您希望发生什么？根据我的经验，很少有好的理由这样做。这会被问到很多问题，问这个问题的人几乎总是想做一些有更好方法的事情……”“只有jquery的例子”……我对此表示怀疑，因为fullCalendar v4没有使用jquery。也许你只是指JavaScript？“我如何获取当前日期”…调用该方法。文档说明了如何执行此操作（在“访问fullCalendar的API”一节中）。@ADyson感谢您的快速回答，我希望获得这些事件，因为，例如，如果我在dayGridView中，我按下一步，我只希望从数据库中获取第二天的事件，或者，如果我在monthGridView，请获取下个月的活动。关于日期。。。我想得到当前的日期，每次它的变化。。。你能推荐我使用其他工具吗？是的，我会的。fullCalendar可以自动处理新事件的获取。在最简单的情况下，您可以在服务器上为它提供一个URL，从中可以获取事件的JSON提要—请参阅。每当用户更改日历上的日期（使用“下一个/上一个/今天”按钮）或更改视图以需要更多数据（例如从一天到一个月）时，FullCalendar将访问URL。它将自动将新的开始和结束日期作为参数发送给服务器，服务器只需返回正确的事件。“如何在Prev、Next或Today按钮中获取click事件？”…fullCalendar中对此没有回调，因为预计您不需要处理这些单击。您必须编写自己的事件处理代码并将其附加到这些元素。但你为什么要这么做？单击这些按钮时，您希望发生什么？根据我的经验，很少有好的理由这样做。这会被问到很多问题，问这个问题的人几乎总是想做一些有更好方法的事情……”“只有jquery的例子”……我对此表示怀疑，因为fullCalendar v4没有使用jquery。也许你只是指JavaScript？“我如何获取当前日期”…调用该方法。文档说明了如何执行此操作（在“访问fullCalendar的API”一节中）。@ADyson感谢您的快速回答，我希望获得这些事件，因为，例如，如果我在dayGridView中，我按下一步，我只希望从数据库中获取第二天的事件，或者，如果我在monthGridView，请获取下个月的活动。关于日期。。。我想得到当前的日期，每次它的变化。。。你能推荐我使用其他工具吗？是的，我会的。fullCalendar可以自动处理新事件的获取。在最简单的情况下，你可以简单地在你的服务器上给它一个URL