Question

我正在尝试从角度ui日历构建一个周调度程序，但我一直收到错误：＆＃39;无法读取属性＆＃34;格式＆＃34; of null＆＃39;并且我的活动列表都没有显示。导入所有依赖项，我在index.html上声明ui日历，如下所示：

<body ng-controller="MainCtrl">
<div class="row" on-load="renderCalendar('myCalendar');">
  <div class="col-md-4">
    <h1>All Events</h1>
    <ul>
      <li class="event" ng-repeat="event in eventSource">
        {{event.title}}
        <button type="button" class="btn btn-danger" ng-click="removeEvent($index)"> delete</button>
        </li>
    </ul>
  </div>
  <div class="col-md-8">
    <div ui-calendar="uiConfig.calendar" ng-model="eventSource" calendar="myCalendar"></div>
  </div>
</div>

我的角度模块声明：

var app = angular.module('calendar-app',
['ngResource',
'ui.calendar']
);

日历显示在页面上，但没有我的硬编码事件（事件在我的控制器中声明）。我在这里有一个这个调度程序的插件：https://plnkr.co/edit/Plscx3IiZb5h9cE7Wdv6?p=preview

我已就相关问题进行了大量搜索，但无法找到解决此问题的方法。我该如何正确渲染这些事件？

Answer 1

Cannot read property "format" of null是与开始或结束时间相关的错误 - Fullcalendar正在尝试格式化您的日期并失败。这是因为您的Plunker中显示的事件将开始日期和结束日期指定为Javascript Date对象：

{title: 'All Day Event',start: new Date(y, m, 6),allDay:true},

这不是Fullcalendar要求的格式 - as the docs describe，您需要使用：

Moment-ish输入，类似于ISO8601字符串。

ISO8601字符串看起来像2017-10-18。如果您想坚持使用Javascript＆＃39; Date，请使用toISOString()进行快速修复：

{title: 'All Day Event', start: new Date(y, m, 6).toISOString(), allDay:true},

您还可以切换到使用Moment，这是Fullcalendar所必需的：

{title: 'All Day Event', start: moment().date(6), allDay:true},

Angular uiCalendar不会重新生成事件

1 个答案: