如何在 Angular 中初始化完整日历版本 4
How to initialize Full Calendar version 4 in Angular
我正在尝试使用完整日历版本 4,这样我就可以在后台模式下将鼠标悬停在事件上。出于某种原因,我无法在我的组件中初始化它(设置选项),我的意思是它在我 运行 ng 服务时工作,但我在我的 IDE 上出错。我将 post 此处的图片错误以及我的代码。
您可以在此处查看官方文档 https://fullcalendar.io/docs/v4/release-notes
我尝试使用 OptionInputs 作为参数,但没有成功
import { Component, OnInit } from '@angular/core';
import { DataService } from './../../shared/services/data.service';
import 'fullcalendar';
import { Calendar } from 'fullcalendar';
@Component({
selector: 'app-calendar',
templateUrl: './calendar.component.html',
styleUrls: ['./calendar.component.css']
})
export class CalendarComponent implements OnInit {
constructor(private dataService: DataService) {}
myEvents = [];
transformDate(str: String) {
return str.substr(0, 10);
}
ngOnInit() {
const calendarEl = document.getElementById('calendar');
const calendar = new Calendar(calendarEl, {
events: [
{
title: 'Test A',
start: '2018-10-09T16:00:00'
}
]
});
calendar.render();
}
}
您正在以错误的结构编写选项对象,它需要一个插件属性
const calendar = new Calendar(calendarEl, {
events: [
{
title: 'Test A',
start: '2018-10-09T16:00:00'
}
],
plugins: []
});
我正在尝试使用完整日历版本 4,这样我就可以在后台模式下将鼠标悬停在事件上。出于某种原因,我无法在我的组件中初始化它(设置选项),我的意思是它在我 运行 ng 服务时工作,但我在我的 IDE 上出错。我将 post 此处的图片错误以及我的代码。 您可以在此处查看官方文档 https://fullcalendar.io/docs/v4/release-notes
我尝试使用 OptionInputs 作为参数,但没有成功
import { Component, OnInit } from '@angular/core';
import { DataService } from './../../shared/services/data.service';
import 'fullcalendar';
import { Calendar } from 'fullcalendar';
@Component({
selector: 'app-calendar',
templateUrl: './calendar.component.html',
styleUrls: ['./calendar.component.css']
})
export class CalendarComponent implements OnInit {
constructor(private dataService: DataService) {}
myEvents = [];
transformDate(str: String) {
return str.substr(0, 10);
}
ngOnInit() {
const calendarEl = document.getElementById('calendar');
const calendar = new Calendar(calendarEl, {
events: [
{
title: 'Test A',
start: '2018-10-09T16:00:00'
}
]
});
calendar.render();
} }
您正在以错误的结构编写选项对象,它需要一个插件属性
const calendar = new Calendar(calendarEl, {
events: [
{
title: 'Test A',
start: '2018-10-09T16:00:00'
}
],
plugins: []
});