FullCalendarを変更するngDialogモーダルからイベント情報（開始と終了）

Question

ドラッグ可能な外部イベントを含むarshawのフルカレンダーのui-calendarディレクティブを使用しています。

カレンダー自体でイベントをドラッグしなくても、ポップアップダイアログでテキストボックスを使ってタイトルの編集、開始、終了ができます。私はモーダルにngDialogを使用していて、コントローラのスコープを通じてクリックされたイベントにアクセスできます。カレンダーのイベントタイトルは変更に応答しますが、開始時刻と終了時刻は変更されません。

モーダルで保存をクリックすると、更新された情報が特定のclientEventをidで見つけた関数（$scope.updateEventInfo）に渡してから、clientEventプロパティを更新します。

私は、新しいタイトルがカレンダーにレンダリングされますが、開始時間と終了時間がない（.fullCalendar('updateEvent', event)）

fullCalendar UpdateEventはを呼び出します。

開始時刻と終了時刻の書式設定または再割り当てが必要な方法はありますか？

コントローラー：

$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> 

Answer 1

私は過去1週間のこのカレンダーをいじりされています。私が特定のイベントを更新するために行ってきたことは、アレイから既存のイベントをスプライスし、新しく更新されたイベントをプッシュすることです。

$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'ある2編集

'clickedEvent[0]'に：そう

オーケー

は、私が使用して、具体的イベントと日付と時刻を更新することができました私はそれをもっとうまく使いこなしていました。私は、あなたが日付をmomentjsオブジェクトにフォーマットする必要があることを認識しました。このようなもの：