title: Angular calendar ui, load events from database
body: <p>I started Angular js recently, and for a project, i have to use calendar-ui to manage events from database.</p>
  
  <p>I managed to use the calendar correctly, using first events create manually. I tried now to bind with datas in database, but it's now comes the problem.</p>
  
  <p>Here is my code :</p>
  
  <pre><code>$scope.eventsTab = [];
  $scope.events = {};    
  $http({
          url: "myurl",
          method: "POST",
          data: postData,
          headers: {'Content-Type': 'application/x-www-form-urlencoded'}
      }).success(function (data) {
              $scope.eventsTab.push({type:'session',title: data.title,start: new Date(y, m, 11, 15, 0),end: new Date(y, m, 20, 17, 30),url: 'http://google.com/'});
              $scope.events = {
                      color: 'orange',
                      textColor: 'white',
                      events: $scope.eventsTab
              };
      });
  $scope.eventSources = [$scope.events];
  </code></pre>
  
  <p>And this is not working, the event is not loaded in my calendar. I think it is a problem dues to asynchronous matters, because if i put the code from "success" function juste before the following line</p>
  
  <pre><code>$scope.eventSources = [$scope.events];   
  </code></pre>
  
  <p>, the events appears in the calendar.</p>
  
  <p>A last thing, when i use debug, i see correctly the data form the database .</p>
  
  <p>Could you help me please?</p>
  
  <p>Thanks !</p>
  
  <p><strong>Edit 1</strong></p>
  
  <p>If i put the code like this</p>
  
  <pre><code>$http({
      url: "myurl",
      method: "POST",
      data: postData,
      headers: {'Content-Type': 'application/x-www-form-urlencoded'}
  }).success(function (data) {
          $scope.eventsTab.push({type:'session',title: data.title,start: new Date(y, m, 11, 15, 0),end: new Date(y, m, 20, 17, 30),url: 'http://google.com/'});
          $scope.events = {
                  color: 'orange',
                  textColor: 'white',
                  events: $scope.eventsTab
          };
          $scope.eventSources = [$scope.events];
  });
  </code></pre>
  
  <p>I got the error <strong>TypeError: Cannot read property 'length' of undefined</strong></p>
  
  <p>And with the following code</p>
  
  <pre><code>$http({
      url: "myurl",
      method: "POST",
      data: postData,
      headers: {'Content-Type': 'application/x-www-form-urlencoded'}
  }).success(function (data) {
          $scope.eventsTab.push({type:'session',title: data.title,start: new Date(y, m, 11, 15, 0),end: new Date(y, m, 20, 17, 30),url: 'http://google.com/'});
          $scope.events = {
                  color: 'orange',
                  textColor: 'white',
                  events: $scope.eventsTab
          };
          $scope.eventSources = [$scope.events];
  });
  $scope.eventSources = [$scope.events];
  </code></pre>
  
  <p>No error, but the same problem : the event is not displayed in the calendar.</p>