title: AngularJS FullCalendar - Events not loading on initial load
body: <h2>Issue</h2>
  
  <hr>
  
  <p>I am struggling to get my events to populate the Full Calendar on load. The events work fine when I change the month, but when the application first loads they don't seem to appear.</p>
  
  <h2>Code</h2>
  
  <hr>
  
  <p>Here is my code for for the <code>UIConfig</code> of the Calendar:</p>
  
  <pre><code>//THIS CALLS MY GET METHOD.
  var holidaysnew = getUserEventsById.getUserEventsById();
  
  $scope.uiConfig = {
      calendar: {
          viewRender: function (view, element) {
              holidaysnew.forEach(function (hol) {
  
                  $scope.eventSources[0].events.push({
                      end: $filter('dateFilter')(hol.HOLIDAY_END),
                      start: $filter('dateFilter')(hol.HOLIDAY_START),
                      title: hol.HOLIDAY_TITLE,
                      color: $filter('colorEventFilter')(hol.HOLIDAY_EVENT_STATE_ID)
                  });
              });
          },
          height: 850,
          editable: true,
          header: {
              left: '',
              center: '',
              right: ''
          },
      }
  };
  </code></pre>
  
  <p>Now the <code>viewRender</code> gets hit on load aswell as when I change the month. The weird thing is it only works when you click a new month.</p>