ng-table TypeError: Nie można ustawić właściwości "$ data" o wartości zerowej

Question

Używam tabeli ng do wyświetlania informacji z wywołania interfejsu API, które grupuję jak przykład na website.

Jednak przykład na stronie korzysta z informacji statycznych, gdzie potrzebuję do każdego nowego wywołania API. Kiedy nie włączam funkcji $ scope.$watch('groupby', function(value), jestem gotów wyświetlić tabelę dla pierwszego, początkowego połączenia.

angular.module('myApp.controllers', ['ngTable','ui.bootstrap','dialogs']) 
.controller('HomeCtrl', function($scope,$log, $rootScope, $modal, TimeService, EventServiceAPI, $filter, ngTableParams) { 
    var datum = new Date().setHours(0,0,0,0); 
    $scope.datum = datum; 
    var timestamp = Math.round(new Date().getTime()/1000); 


    var findAllEvents = function(timestampdata) { 
     EventServiceAPI.query({start: timestampdata, end: timestampdata + 3*24*60*60}).$promise.then(function(data) { 

      //var data = $filter('orderBy')(data, 'event.startHour'); 

      $scope.$watch("data", function() { 
       $scope.tableParams.reload(); 
      }); 

      $scope.tableParams = new ngTableParams({ 
       page: 1,   // show first page 
       count: 100   // count per page 

      }, { 
       groupBy: function(item) { 
        return 'Start vanaf ' + item.event.startHour + ' uur'; 
       }, 
       total: data.length, 
       getData: function($defer, params) { 
        var orderedData = params.sorting() ? 
          $filter('orderBy')(data, 'event.startHour') : 
          data; 

        $defer.resolve(orderedData.slice((params.page() - 1) * params.count(), params.page() * params.count())); 
       } 
      }); 

      $scope.$watch('groupby', function(value){ 
       $scope.tableParams.settings().groupBy = value; 
       console.log('Scope Value', $scope.groupby); 
       console.log('Watch value', this.last); 
       console.log('new table',$scope.tableParams); 
       $scope.tableParams.reload(); 
      }); 
     }) 
    };  

    findAllEvents(timestamp); 

    $scope.getEarlier = function() { 
     datum -= (24 * 60 * 60 * 1000); 
     $scope.datum = datum; 
     var timestamp = Math.round(datum/1000); 
     console.log(timestamp); 
     findAllEvents(timestamp); 

    }; 
}); 

EDIT:

jestem teraz w stanie wyświetlać dane, ale grupy nie są wyświetlane:

var datum = new Date().setHours(0,0,0,0); 
    $scope.datum = datum; 
    var timestamp = Math.round(new Date().getTime()/1000); 

    EventServiceAPI.query({start: timestamp, end: timestamp + 3*24*60*60}).$promise.then(function(data) { $scope.data = data; initlizeTable(); }); 


    var initlizeTable = function() { 
     // Table 
     $scope.tableParams = new ngTableParams({ 
      page: 1,   // show first page 
      count: 100   // count per page 

     }, { 
      groupBy: function(item) { 
       return 'Start vanaf ' + $scope.data.event.startHour + ' uur'; 
      }, 
      total: $scope.data.length, 
      getData: function($defer, params) { 
       var data = EventServiceAPI.query({start: timestamp, end: timestamp + 3*24*60*60}); 
       var orderedData = params.sorting() ? 
         $filter('orderBy')($scope.data, 'event.startHour') : 
          $scope.data; 

         $defer.resolve($scope.data.slice((params.page() - 1) * params.count(), params.page() * params.count())); 
      }, $scope: { $data: $scope.data } 
     }); 

     $scope.$watch('groupby', function(value){ 
      $scope.tableParams.settings().groupBy = value; 
      console.log('Scope Value', $scope.groupby); 
      console.log('Watch value', this.last); 
      console.log('new table',$scope.tableParams); 
      $scope.tableParams.reload(); 
     }); 

     $scope.$watch('data', function(value){ 
      $scope.tableParams.settings().groupBy = value; 
      console.log('Scope Value', $scope.groupby); 
      console.log('Watch value', this.last); 
      console.log('new table',$scope.tableParams); 
      $scope.tableParams.reload(); 
     }); 

    } 

Answer 1

wiem, że to zbyt późno, ale pomyślałem, że lepiej skomentuj to dla innych, którzy szukają odpowiedzi na ten sam problem.

Też miałem ten sam problem i udało mi się go naprawić, podążając za przykładem w następującym adresie URL.

https://github.com/esvit/ng-table/blob/master/src/scripts/04-controller.js

Właśnie dodany następujący wiersz kodu do mojego kodu po utworzeniu instancji "ngTableParams.

$scope.params.settings().$scope = $scope; 

Answer 2

here spojrzeć, konfigurowania wszystkich parametrów dla ngTableParams rozwiązał problem

Answer 3

To kiedy to rozpoczął pracę dla mnie. Dodałem zakres w params.settings.

controller: function() { 
... 
$scope.myTableParams = new ngTableParams({ 
. 
},{ 
... 
getData: function ($defer, params) { 
    if (params.settings().$scope == null) { 
     params.settings().$scope = $scope; 
    } 
. 
. 
}