Ng-grid Cannot set property "gridDim" from undefined

Question

I am new to Angular and I am trying to declare gridOption for ng-grid. In function in costroller.

This causes an error:

TypeError: Unable to set property 'gridDim' from undefined

I tried to solve it using $ scope.apply and ng-if in the template. But none of this works for me.

Thanks for any advice:

controller method:

$scope.getTest = function() { $http.get('http://www.iNorthwind.com/Service1.svc/getAllCustomers') .success(function (data, status, headers, config) { //$scope.myData = data; console.log('Sucess' + data); // definition for ng-grid table $scope.myData = [{ name: "Moroni", age: 50 }, { name: "Tiancum", age: 43 }, { name: "Jacob", age: 27 }, { name: "Nephi", age: 29 }, { name: "Enos", age: 34}]; $scope.gridOptions = { data: 'myData' }; //$scope.$apply(); }) .error(function(data, status, headers, config) { $scope.myData = data; }); }; 

Answer 1

I ran into this problem yesterday ....

The initial rendering of ng-grid requires parameters that will be delivered initially, and not after the promise of $http is fulfilled.

Move your call to $scope.gridOptions = { data: 'myData' } outside of your promise of success, and your problem should go away.

Answer 2

It works for me when we define "gridOptions" outside of success and error methods, as shown below:

 $scope.getCategory = function(){ var listURL = "/sites/AwardTrackingSystem/_api/web/lists/getByTitle('Categories')/items"+ "?$select=Id,Title"; srvcQuerySPList.getItems(listURL) .then( function(data){ $scope.allCategory = data; }, function(data){alert('Error Awards---------------'+JSON.stringify(data));} ); }; $scope.gridOptions = { data: 'allCategory'};