无法在 eventReceived 事件中为 Angular 中的事件设置 ID

Posted

技术标签:

【中文标题】无法在 eventReceived 事件中为 Angular 中的事件设置 ID【英文标题】:Not able to set ID for event in Angular on eventReceived event 【发布时间】:2020-03-16 23:57:19 【问题描述】:

我正在使用具有拖放功能的 Angular 的全日历模块。 当用户在日历上删除新事件时,我想设置 ID。但是不知道怎么设置。

这是Stackblitz URL。 下面还有eventReceive函数。

eventReceive(event) 
  const dataSet = event.draggedEl.dataset.event;
  const dataJson = JSON.parse(dataSet);
  const eventIndex: number = this.eventList.findIndex(d => d.id === dataJson.id);
  this.eventList.splice(eventIndex, 1);
  const isAllday = event.event.allDay;
  const endEventDate = event.event.end;
  const startEventDate = new Date(event.event.start);

  const EventTimeObject: any = 
    type: 'event',
    id: dataJson.id,
    start: startEventDate.toUTCString(),
    title: dataJson.title,
    color: dataJson.color
  ;

  if (isAllday) 
    const endTime = new Date(startEventDate);
    const endTimeHour = endTime.setHours(23, 59, 59, 999);
    EventTimeObject.end = endTimeHour;
  
  if (!isAllday && endEventDate === null) 
    const endTime = new Date(startEventDate);
    const endTimeHour = endTime.setHours(endTime.getHours() + 1);
    EventTimeObject.end = endTimeHour;
   else if (endEventDate) 
    EventTimeObject.end = new Date(endEventDate).getTime();
  

  this.eventsModel = [...this.eventsModel, EventTimeObject];

  console.log(this.eventsModel);
  // this.plannerService.addActionDates(EventTimeObject);

【问题讨论】:

你想在哪里设置ID?据我观察,日志已经记录了所有对象数据。 @Mukyuu 我想在事件删除时设置 ID,即 eventReceived 函数,在上面的代码中,当您在用户调整大小或单击日历上删除的新事件时检索 ID 时,它不显示 ID那个事件。例如,尝试在日视图中删除任何事件,然后调整该事件的大小。您的 ID 未在调试器中显示,有关更多详细代码,请查看 Stackblitz 【参考方案1】:

好吧,我想通了, 但我不确定这是否是正确的做法, 解决方案是需要在draggrable对象中添加id

draggableEvent() 
 new Draggable(this.external.nativeElement, 
  itemSelector: '.fc-event',
  eventData(eventEl) 
    return 
      title: eventEl.innerText,
      id: eventEl.id
    ;
  
 );

【讨论】:

以上是关于无法在 eventReceived 事件中为 Angular 中的事件设置 ID的主要内容,如果未能解决你的问题,请参考以下文章