Updating eventSource array

[paul2569]

I'm a little confused as to how the eventSource array gets displayed.

Using the 'Week' view I can push in my events I have retrieved from an API. These display correctly, however if I then try to splice the eventSource array or push additional objects into the array, the array is updated but the view isn't. Changing the view to next / prev week causes it to display events correctly.

How can I get the view to refresh with current events in eventSource?

Thanks.

[twinssbc]

@pillage This is because the calendar controller only uses $watch on the eventSource, so it's only notified when the eventSource reference is changed, but not include some deep change in the eventSource array. $watchCollection supports watching array element change and $watch also supports extra parameter to watch deep change, but they are relatively expensive. As I think the common scenario is each time you update the eventSource, you will reload the data from backend again. So I choose the least expensive way to watch the change. But I do understand your scenario, so I added some way to make you able to manually notify controller the change, now the controller is listening on 'eventSourceChanged' event. You can call $scope.$broadcast('eventSourceChanged',$scope.eventSource) to fire the event. I've also updated the README for your reference.

[edmondchui]

In the month view, after removing items from $scope.eventSource, I call $scope.$broadcast('eventSourceChanged',$scope.eventSource). Inside the function _onDataLoaded, the loop for (var i = 0; i < len; i += 1) only loop for the current events in the $scope.eventSource, not for the dates currently shown in the view. As a result we have no chance to adjust the style of date (when the event count changes from 1 to 0 on that day).

Please suggest how to fix it.

[edmondchui]

I have a simple solution, though not necessary inexpensive.

Inside calendar.js, at the end of the calendar directive declaration, add an event handler for a new event eventSourceElementChanged to force a refreshView()

        scope.$on('eventSourceElementChanged', function(event) {
          calendarCtrl.refreshView();
        });

In our code after we add/update (e.g. change date)/remove an event, we can call this

          $scope.$broadcast('eventSourceElementChanged');