Day Button 和 Week Button 不显示
Day Button and Week Button is not displayed
我正在使用带有 angularjs 的完整日历来显示事件。目前月视图工作正常。但是 day button 和 week button 没有显示在 UI.In 左右两侧 Only Today, back and next buttons are displayed.I 想不通这是什么原因。请找到以下代码。
view.html
<html>
<head>
<link rel="stylesheet" href="../fullcalendar-4.1.0/packages/core/main.css"></script>
<link rel="stylesheet" href="../fullcalendar-4.1.0/packages/daygrid/main.css"></script>
<link rel="stylesheet" href="../fullcalendar-4.1.0/packages/list/main.css"></script>
<link rel="stylesheet" href="../fullcalendar-4.1.0/packages/timegrid/main.css"></script>
<script type="text/javascript" src="../fullcalendar-4.1.0/packages/core/main.js"></script>
<script type="text/javascript" src="../fullcalendar-4.1.0/packages/daygrid/main.js"></script>
<script type="text/javascript" src="../fullcalendar-4.1.0/packages/timegrid/main.js"></script>
<script type="text/javascript" src="../fullcalendar-4.1.0/packages/list/main.js"></script>
</head>
<script>
$scope.event = {events: [{
title:'test1',
start: '2019-05-05 08:00',
end: '2019-05-10 08:00'
},
{
title:'test2',
start: '2019-05-05 12:00'
}]};
var calendarEl = document.getElementById('calendar');
var calendar = new FullCalendar.Calendar(calendarEl, {
events: $scope.event.events,
plugins: [ 'dayGrid','timeGrid','list' ],
header: {
left: 'prev,next today',
center: 'title',
right: 'month,agendaWeek,agendaDay'
}
});
calendar.render();
});
</script>
<body ng-app="myApp" ng-controller="myController">
<div id="calendar" ng-model="eventSources"></div>
</body>
</html>
您可以在脚本中添加以下代码行来显示日视图和周视图。
header: {
left: 'prev,next today',
center: 'title',
right: 'dayGridMonth,dayGridWeek,timeGridDay'
}
更改右侧 属性 字段的原因是最新版本的 FullCalendar 不支持 agendaWeek、agendaDay 字词
我正在使用带有 angularjs 的完整日历来显示事件。目前月视图工作正常。但是 day button 和 week button 没有显示在 UI.In 左右两侧 Only Today, back and next buttons are displayed.I 想不通这是什么原因。请找到以下代码。
view.html
<html>
<head>
<link rel="stylesheet" href="../fullcalendar-4.1.0/packages/core/main.css"></script>
<link rel="stylesheet" href="../fullcalendar-4.1.0/packages/daygrid/main.css"></script>
<link rel="stylesheet" href="../fullcalendar-4.1.0/packages/list/main.css"></script>
<link rel="stylesheet" href="../fullcalendar-4.1.0/packages/timegrid/main.css"></script>
<script type="text/javascript" src="../fullcalendar-4.1.0/packages/core/main.js"></script>
<script type="text/javascript" src="../fullcalendar-4.1.0/packages/daygrid/main.js"></script>
<script type="text/javascript" src="../fullcalendar-4.1.0/packages/timegrid/main.js"></script>
<script type="text/javascript" src="../fullcalendar-4.1.0/packages/list/main.js"></script>
</head>
<script>
$scope.event = {events: [{
title:'test1',
start: '2019-05-05 08:00',
end: '2019-05-10 08:00'
},
{
title:'test2',
start: '2019-05-05 12:00'
}]};
var calendarEl = document.getElementById('calendar');
var calendar = new FullCalendar.Calendar(calendarEl, {
events: $scope.event.events,
plugins: [ 'dayGrid','timeGrid','list' ],
header: {
left: 'prev,next today',
center: 'title',
right: 'month,agendaWeek,agendaDay'
}
});
calendar.render();
});
</script>
<body ng-app="myApp" ng-controller="myController">
<div id="calendar" ng-model="eventSources"></div>
</body>
</html>
您可以在脚本中添加以下代码行来显示日视图和周视图。
header: {
left: 'prev,next today',
center: 'title',
right: 'dayGridMonth,dayGridWeek,timeGridDay'
}
更改右侧 属性 字段的原因是最新版本的 FullCalendar 不支持 agendaWeek、agendaDay 字词