1

我正在尝试FullCalendar在 Angular 应用程序中设置一些特定选项，例如locale, themeSystem。我在网上发现人们正在使用[options]属性设置这些选项，但似乎FullCalendar版本 4 没有这样的属性。

任何适用的指令或 fullcalendar 元素均未提供属性选项

我也尝试使用 api。

import { Component, OnInit, ViewChild } from '@angular/core';
import dayGridPlugin from '@fullcalendar/daygrid';
import { FullCalendarComponent } from '@fullcalendar/angular';
import { OptionsInput } from '@fullcalendar/core/types/input-types';

export class AppComponent implements OnInit {

  @ViewChild('calendar') calendarComponent: FullCalendarComponent;

  options: OptionsInput;

  constructor() {

  }

  calendarPlugins = [dayGridPlugin];

  ngOnInit(): void {
    this.options = {
      locale: 'pl',
      themeSystem: 'bootstrap'
    };
    const api = this.calendarComponent.getApi();
    api.setOptions(this.options);
    api.render();
  }
}

<full-calendar
  #calendar
  defaultView="dayGridMonth"
  [plugins]="calendarPlugins">
</full-calendar>

但我明白了

错误类型错误：无法读取未定义的属性“setOptions”

如何在不为类中的每个属性创建的情况下设置多个选项？

4

1 回答 1

1

此错误表示此对象中不存在此 setOption，请检查您的日历参考，设置选项时是否正确初始化，有时日历处于初始化阶段，我们正在设置值。在 SetTimeOut 中添加 500 毫秒这样的选项。在 500 毫秒内，您的日历将初始化

          ngOnInit(): void {
            this.options = {
              locale: 'pl',
              themeSystem: 'bootstrap'
            };
           setTimeout(()=>{ 
    const api = this.calendarComponent.getApi();
            api.setOptions(this.options);
            api.render();
           },500);
          }
    }

或者你可以使用这个 ngAfterViewInit

   ngAfterViewInit(){
     const api = this.calendarComponent.getApi();
                api.setOptions(this.options);
                api.render();
}
于 2019-05-10T20:37:16.673 回答