为 FullCalendar 的周和每日视图添加结束时间

Question

我现在正在使用FullCalendar v2，我发现它非常有用。但是，当我想显示事件的结束时间时遇到了问题。

我想显示一周中一天内的开始时间和结束时间以及每日视图，例如“09:00-17:00”。我在仅在全日历周视图中显示结束时间中找到了解决方案，但它似乎是 v1 版本。我在 v2 中使用它但失败了。

如何显示一天内的开始时间和结束时间？

Answer 1

我发现这个答案对我有用：https://stackoverflow.com/a/24951989/590382

---

在 FullCalendar >= 2.0.1 中，有一个设置称为

displayEventEnd

。

文档：http://fullcalendar.io/docs/text/displayEventEnd/

是否显示事件的结束时间文本 呈现在日历上。

示例：

displayEventEnd: {
    month: false,
    basicWeek: true,
    "default": true
}

Answer 2

此处的答案：缺少 Fullcalendar 事件的结束时间 适用于版本 1.6.1。但是，formatDates 函数在 v2 中已被 formatRange 取代。所以，使用

eventAfterRender: function(event, $el, view) {
        var formattedTime = $.fullCalendar.formatRange(event.start, event.end, "HH:mm");
        // If FullCalendar has removed the title div, then add the title to the time div like FullCalendar would do
        if($el.find(".fc-event-title").length === 0) {
            $el.find(".fc-event-time").text(formattedTime + " - " + event.title);
        }
        else {
            $el.find(".fc-event-time").text(formattedTime);
        }
    }

Answer 3

不需要像上面那样复杂的答案。 我遇到了同样的问题，我通过简单地配置 fullcalendar 属性来修复它：

timeFormat: {
            month: "HH:mm",
            week: "HH:mm",
            day: "HH:mm"
        },