Question

我使用Jquery和html的完整日历（fullcalendar.io）插件完成了资源调度项目。现在我将这个项目转换为Angular 5.我尝试使用几个流行的角度全日历插件，如

1.https://github.com/Jamaks/ng-fullcalendar
2.https://github.com/mattlewis92/angular-calendar
3.https://github.com/nekken/ng2-fullcalendar

上述所有内容似乎都没有实现fullcalendar-scheduler也不支持像timelineMonth＆＃39;这样的视图。

请注意我已成功完全实现了fullcalendar（https://fullcalendar.io/）的角度，但我无法实现（https://fullcalendar.io/scheduler）这是fullcalender提供的附加组件。

有没有人成功实施过它？或任何插件建议将是一个很大的帮助。

Answer 1

我今天早上刚刚实施了它。最大的问题是你不需要npm安装fullcalendar本身，因为它已经是调度程序的依赖项。希望这会有所帮助：

<强>的package.json：

"dependencies": {
  "fullcalendar-scheduler": "^1.9.3",
  "jquery": "^3.3.1",
},
"devDependencies": {
  "@types/jquery": "^3.3.0",
}

<强>角-cli.json：

"styles": [
    "styles.css",
    "../node_modules/fullcalendar/dist/fullcalendar.min.css",
    "../node_modules/fullcalendar-scheduler/dist/scheduler.min.css"
  ],
  "scripts": [
    "../node_modules/jquery/dist/jquery.min.js",
    "../node_modules/moment/min/moment.min.js",
    "../node_modules/fullcalendar/dist/fullcalendar.min.js",
    "../node_modules/fullcalendar-scheduler/dist/scheduler.min.js"
  ],

<强> Component.ts

import * as $ from 'jquery';
import 'fullcalendar';
import 'fullcalendar-scheduler';

export class CalendarComponent implements AfterViewInit {

    @Input() options;

    @Component({
        selector: 'app-calendar'
    })

    ngAfterViewInit() {
        const containerEl: JQuery = $('app-calendar');
        containerEl.fullCalendar(this.options);
    }
}

Angular 2-5实现fullcalender调度程序

1 个答案: