как поймать следующее, предыдущее, сегодняшнее событие с полным календарем для Angular 7 cli - PullRequest
Новая
       14

как поймать следующее, предыдущее, сегодняшнее событие с полным календарем для Angular 7 cli

0 голосов
/ 11 июля 2019

Я реализую fullCalendar в своем приложении Angular 7, календарь работает, и я импортирую в него некоторые События, но я пытаюсь сделать это более эффективным, я пытаюсь привести только те события, которые нужны календарю.

Итак .. у меня есть несколько вопросов.

Как получить событие нажатия кнопки «Предыдущий» или «Следующий» или «Сегодня»?

Как получить текущую дату?

Я проверял документацию ... но есть только примеры для 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>

И мой Ts 

  @ViewChild('fullcalendar') fullcalendar: FullCalendarComponent;

  constructor() {
    this.options = {

      editable: true,
      header: {
        left: 'prev,next today',
        center: 'title',
        right: 'dayGridMonth, listDay'
      },
      plugins: [dayGridPlugin, listPlugin, timeGridPlugin],
      locale: esLocale,
    };

  }

1 Ответ

1 голос
/ 11 июля 2019

Согласно плагину документы , у вас есть доступ к базовому объекту Calendar для необработанных данных и методов: 

const calendarApi = this.calendarComponent.getApi();

Полный список методов навигации по дате можно найти здесь: https://fullcalendar.io/docs/date-navigation.

Итак, чтобы получить текущую дату, мы можем использовать: 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);
  }

}

Я не нашел событий, генерируемых для кнопок «назад» и «вперед», но вы можете создать свои собственные кнопки, используя методы calendar.prev() и calendar.next(). 

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