全日历所有议程视图不起作用

Question

我浪费了很多时间来寻找解决方案 - 但对我来说没有任何用处。我有一个Angular-1-Webapp，我需要使用jQuery FullCalendar。所有视图正在工作和事件出现 - 但在议程视图中没有事件......

    $('#calendar').fullCalendar({
        //Language
        lang: 'de', 
        //Weekview inital
        defaultView: 'agendaWeek',
        eventSources: [{
            events: [{
                "id" : "789",
                "title"  : 'event1',
                "start"  : "2017-01-11 12:00",
                "end" : "2017-01-11 15:00"
            }]
        }]
    });

.HTML：

<div id="calendar"></div>

这就是检查的内容：

• 导入顺序是 jquery -> css -> js
• 工作正常
• 所有日隙 真/假 - 选中 - 无变化
• 事件中的全天真/假 - 选中 - 无变化

希望有人作为另一个想法！感谢

以下是一些图片

议程周视图

月视图

Answer 1

Working Fidlle

试试这种方式。

var calendar = $('#calendar').fullCalendar({
  defaultView: 'agendaWeek',
  lang: 'de',
  header: {
    left: 'prev,next today',
    center: 'title',
    right: 'month,agendaWeek,agendaDay'
  },
  events: [{
    id: '789',
    title: 'Event1',
    start: '2017-01-11 12:00',
    end: '2017-01-11 15:00',
    allDay: false
  }]
});

Answer 2

好的

，经过一小时的尝试，我发现了问题。FullCalendar需要光子看起来如此。但是在该 css 的第 2256 行中是以下条目：

td {
  padding: 2px 15px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

这个问题在那篇帖子中被发现。将行更改为以下代码后，一切正常：

td {
  padding: 2px 15px;
  white-space: nowrap;
  /* OUT FOR FULL CALENDAR */
  /* overflow: hidden; */
  text-overflow: ellipsis;
}

我真的很困惑，全日历需要光子，但这两个 css 不能完美地协同工作......THX4帮助!!