从ngDialog模式修改FullCalendar事件信息（开始和结束）

我正在使用带有可拖动外部事件的arshaw fullcalendar的ui-calendar指令。从ngDialog模式修改FullCalendar事件信息（开始和结束）

我希望能够通过弹出对话框上的文本框来编辑标题，开始和结束，而不必在日历本身上拖动事件。我使用ngDialog作为模式，并可以通过控制器的作用域访问点击事件。日历上的事件标题会响应更改，但开始和结束时间不会。

当我点击模式保存时，我将更新后的信息传递给一个函数（$scope.updateEventInfo），我通过id找到特定的clientEvent，然后更新clientEvent属性。

我然后调用fullCalendar updateEvent（.fullCalendar('updateEvent', event)）

新标题将呈现在日历上，但开始和结束时间没有。

是否有某种方法需要格式化或重新分配开始和结束时间？

控制器：

$scope.updateEventInfo = function(clickedEvent) { 
     var newTitle = clickedEvent.title; 
     var newStart = clickedEvent._start; 
     var newEnd = clickedEvent._end; 
     var clientEvent = uiCalendarConfig.calendars.myCalendar.fullCalendar('clientEvents', clickedEvent._id); 
     clientEvent[0].title = clickedEvent.title; 
     clientEvent[0].start = newStart; 
     clientEvent[0].end = newEnd; 
     uiCalendarConfig.calendars.festivalLineup.fullCalendar('updateEvent', clickedEvent); 
     } 

    $scope.eventSources = [{ 
     events: [], 
     color: '#428bca', 
     textColor: 'white', 
     overlap: false 
     }] 
    $scope.uiConfig = { 
     calendar: { 
      header: { 
      left: 'prev,next today', 
      center: 'title', 
      right: 'agendaDay,agendaTwoDay,week' 
      }, 
      defaultView: 'agendaDay', 
      height: 'auto', 
      editable: true, 
      droppable: true, 
      eventClick: function(clickedEvent) { 
      $scope.clickedEvent = clickedEvent; 
      $scope.openModal('EditCalendarEvent'); 
      }, 
     } 
     };

ngDialog代码：

<div class="modal-container">  
    <h4>{{clickedEvent.title}}</h4> 
    <form> 
     <div class="input-field"> 
     <input id="eventTitle" type="text" ng-model="clickedEvent.title"/> 
     <label for="eventTitle">Event Title</label> 
     </div> 
     <div class="input-field"> 
     <input id="startTime" type="text" ng-model="clickedEvent.start"/> 
     <label for="startTime">Event Start</label> 
     </div> 
     <div class="input-field"> 
     <input id="endTime" type="text" ng-model="clickedEvent.end"/> 
     <label for="endTime">Event End</label> 
    </div> 
    </form> 
     <button type="button" ng-click="updateEventTimes(clickedEvent)">Save</button> 
</div>

来源

2016-04-22 yam55

我一直在与此日历在过去的一周瞎搞。我一直在做什么来更新一个特定的事件是拼接数组中的现有事件并推送新更新的事件。

$scope.saveEvent = function() { 
    $scope.events.forEach(function(ev) { 
     if (ev._id == $scope.selectedEvent._id) { 
      $scope.events.splice($scope.events.indexOf(ev),1); 
     } 
    }); 
    $scope.events.push($scope.selectedEvent); 
    $scope.closeModal(); 
};

我看到用同样的方法其他一些人的推理有事可做与日历实例和javascript引用（我不是专家）。

编辑：

其实，我误解你使用的方法和可能拉从过时的版本的例子。

我能够通过使用专门更新事件的日期和时间：uiCalendarConfig.calendars.festivalLineup.fullCalendar('updateEvent', clickedEvent);

所有你需要做的是改变'clickedEvent'到'clickedEvent[0]'

编辑二：

好了，我更多地搞乱了它，而且我意识到是的，你必须将日期格式化为一个时刻对象。类似这样的：

var newStart = moment(clickedEvent.start, , "MM/DD/YYYY HH:mm")

来源

2016-04-25 13:33:11 mtmoran

从ngDialog模式修改FullCalendar事件信息（开始和结束）

回答

相关问题