title: Paging is reset when data is updated with Angular-DataTables
body: <p>We have a Web form using Angular DataTables (DataTables 1.10.10 / angular-datatables - v0.5.3). We are feeding the data with a JSON coming from the backend. The table is configured with paging, and data feeding the table is reloaded manually every 10 secs. This is all working fine, when I select a different page from 1st one and the table get refreshed then paging is reset. I tried the different params of the draw(<a href="https://datatables.net/reference/api/draw()" rel="noreferrer">https://datatables.net/reference/api/draw()</a>) method but did not make any difference.. 
  Many thanks in advance!!</p>
  
  <p>My HTML table:</p>
  
  <pre><code>&lt;table datatable="ng" id="datatable1" dt-options="dtOptions" dt-column-defs="dtColumnDefs" class="table table-striped table-hover" dt-instance="dtInstance"&gt;
  </code></pre>
  
  <p><code>&lt;tr ng-repeat="session in data.serverData[data.selectedAgent]" class="gradeX"&gt;</code></p>
  
  <p>This is our controller:</p>
  
  <pre><code>App.controller("ReportAgentSessionsListController", [
  "$scope", "$http", "sessionsListData", "$timeout", "DTOptionsBuilder", "DTColumnDefBuilder", function ($scope, $http, sessionsListData, $timeout, DTOptionsBuilder, DTColumnDefBuilder, DTInstances) {
  
  $scope.dtOptions = DTOptionsBuilder.newOptions().withPaginationType("simple_numbers").withDisplayLength(25).withOption("retrieve", true).withOption('order', [0, 'desc']);
   $scope.dtColumnDefs = [
          DTColumnDefBuilder.newColumnDef(0),
          DTColumnDefBuilder.newColumnDef(1),
          DTColumnDefBuilder.newColumnDef(2),
          DTColumnDefBuilder.newColumnDef(3).notSortable(),
      ];
  
      // Get original request params
      $scope.dateData = JSON.parse(sessionsListData.config.data);
  
      var timer;  // used for auto-refresh
      var vm = this;
      $scope.cduInterval = 1000;
      $scope.counter = 0;
      $scope.dtInstance = {};
      $scope.data = {};
      $scope.data.serverData = [];
  
      var formatServerData = function(serverData) {
  
          $scope.agentsList = Object.keys(serverData);
          // If no agent has been selected
          if (!$scope.data.selectedAgent) {
              $scope.data.selectedAgent = $scope.agentsList[0];
          }
          // Format data
          for (var key in serverData) {
              if (serverData.hasOwnProperty(key)) {
                  for (var i = 0; i &lt; serverData[key].length; i++) {
                      var data = serverData[key][i];
                      data.waitTime = numeral(data.waitTime).format("00:00:00");
                      data.handleTime = numeral(data.handleTime).format("00:00:00");
                      data.revenue = numeral(data.revenue).format("$0,0.00");
                  }
              }
          }
          $scope.data.serverData = serverData;
          // This does not do anything apparently
          if ($scope.dtInstance.DataTable) {
              $scope.dtInstance.DataTable.draw('full-hold');
          }
      };
  
      var scheduleTimeout = function () {
          var getFreshDataInterval = 1000;
          timer = $timeout(getFreshData, getFreshDataInterval);
      };
  
      // Request a new set of data from the server
      var getFreshData = function () {
          if ($scope.counter++ % 10 == 0) {   // Requests to server will be done every 10th request (10 secs)
  
              var response = $http({
                  abp: true,
                  url: abp.appPath + "Report/GetTeamSessionsByTimeInterval",
                  method: "POST",
                  data: sessionsListData.config.data
              }).then(function (response) {
                  formatServerData(response.data);
                  if (timer) {
                      scheduleTimeout();
                  }
              });
          }
          else {
              if (timer) {
                  scheduleTimeout();
              }
          }
      };
  
      // Is currentdate between the date ranges being displayed
      var isTodayInRage = function (currentdate) {
          ..
      }
  
      formatServerData(sessionsListData.data);
  
      if (isTodayInRage(userCurrentDate)) {
          // Date range includes Today (local time)
          scheduleTimeout();
      }
  
      $scope.selectAgent = function(agent) {
          $scope.data.selectedAgent = agent;
      };
  
      $scope.$on("$destroy", function () {
          if (timer) {
              $timeout.cancel(timer);
          }
      });
  }]);
  </code></pre>