title: Angular Datatable Server Side pagination filtering, totalrecords, data are undefined
body: <p>I'm trying to implement Angular Datatable Server side pagination but I'm getting the following error:</p>
  
  <pre><code>TypeError: Cannot read property 'length' of undefined
  </code></pre>
  
  <p>When I console the <strong>result</strong> in factory <strong>all 89 records</strong> are there, When it comes to controller and I console <strong>result</strong> within <strong>filterService.execute</strong> all records are shown. but when I console <strong>records</strong> which actually determines "drwa, totalrecords, filteredrecords and data" everything is undefined except draw. like this:</p>
  
  <pre><code>Object {draw: 1, recordsTotal: undefined, recordsFiltered: undefined, data: undefined}
  </code></pre>
  
  <p>can anyone please take a look and tell me what is it I'm doing wrong here, any help would be appreciated in advance. Thanks</p>
  
  <p><strong>Controller:</strong></p>
  
  <pre><code>angular.module('withServerSide', ['datatables'])
  .controller('withServerSideController', function WithPromiseController($scope, DTOptionsBuilder, DTColumnBuilder, filterService)
  {
      $scope.dtColumns = [
          DTColumnBuilder.newColumn('es_officer_id', 'Id'),
          DTColumnBuilder.newColumn('es_officer_name', 'Name')
      ];
  
      $scope.dtOptions = DTOptionsBuilder
          .newOptions()
          .withFnServerData(serverData)
          .withDataProp('es_officers') //Tried 'data' as well
          .withOption('processing', true)
          .withOption('serverSide', true)
          .withOption('paging', true)
          // .withOption('rowCallback', rowCallback)
          .withPaginationType('numbers')
          .withDisplayLength(10)
          .withDOM('&lt;"top"&gt;t&lt;i"bottom"p&gt;&lt;"clear"&gt;');
  
      function serverData(sSource, aoData, fnCallback, oSettings) {
  
          //All the parameters you need is in the aoData variable
          var draw = aoData[0].value;
          var order = aoData[2].value;
          var start = aoData[3].value;
          var length = aoData[4].value;
  
          //Then just call your service to get the records from server side
          filterService.execute(start, length, order).then(function(result){
  
              console.log(result);
              var records = {
                      'draw': draw,
                      'recordsTotal': result.total,
                      'recordsFiltered': result.filtered,
                      'data': result.records  
                  };
              fnCallback(records);
          });
      }
  });
  </code></pre>
  
  <p><strong>filterService Factory:</strong></p>
  
  <pre><code>angular.module('Main_Module').factory('filterService', filterService);
  filterService.$inject = ['$q', '$http']
  function filterService($q, $http)
  {
      var service = {
      execute: execute
      };
  
      return service;
  
          function execute(start, length, order)
          {
              var defered = $q.defer();
              //Make a request to backend api and then call defered.resolve(result);
              $http({ 
                  url   : 'http://localhost:3000/api/SELECTSpecific/es_officers',
                  method: 'GET'
              })
              .then(function successCallback (result) 
              {   
                  console.log(result);
                  defered.resolve(result);
              });
              return defered.promise;
          }
  };
  </code></pre>
  
  <p><strong>HTML:</strong></p>
  
  <pre><code>&lt;div ng-controller="withServerSideController"&gt;
  &lt;table class="table table-striped table-bordered" align="center" datatable="" dt-options="dtOptions" dt-columns="dtColumns" class="row-border hover"&gt;
  &lt;/table&gt;
  </code></pre>
  
  <p></p>