角度JSに

Question

var app = angular.module("finApp", ["ui.grid"]); 
 
app.controller(
 
    "finController", 
 
    function($scope, $http) { 
 
    $http.get("url", "data") 
 
     .then(function(response) { 
 
     $scope.gridOptions.data = response.data; 
 

 
     }, function(errorResponse) {}); 
 
    });

<link href="https://cdn.rawgit.com/angular-ui/bower-ui-grid/master/ui-grid.min.css" rel="stylesheet"/> 
 
<script src="https://cdn.rawgit.com/angular-ui/bower-ui-grid/master/ui-grid.min.js"></script> 
 
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<div ui-grid="gridOptions" class="grid"></div>

をUIグリッドを使用している間、私はエラーの下に取得しています上記のコードの実行中に、私はエラーの下に取得しています：

angular.min.js:122 TypeError: Cannot read property 'data' of undefined
at new (ui-grid.js:3330)
at Object.invoke (angular.min.js:43)
at Q.instance (angular.min.js:93)

Answer 1

初期$scope.gridOptions = {} httpリクエスト

前に

Answer 2

試用：

APIからの応答が成功した場合concatgridDataアレイへの応答データ。 gridDataは$scope.gridOptions.dataにのみ割り当てられています。

-------- 
JS file 
-------- 

$scope.gridOptions = { 
    data: 'gridData', 
    .........., 
    .........., 
    .......... 
} 

$scope.gridData = []; 

$scope.gridData = $scope.gridData.concat(response.data); 

Answer 3

チェックログによる応答または警告

たり、UIのグリッドが動作しているかどうかをテストするには、以下のようなグリッドの列を定義します。

$scope.gridOptions = { 
    paginationPageSizes: [10, 20, 50], 
    paginationPageSize: 10, 
    enableColumnMenus: false, 
    columnDefs: [ 

    { 
     width: '10%', 
     field: 'lastname', 
     displayName: 'Last Name' 
    }, 

    { 
     width: '25%', 
     field: 'firstname', 
     displayName: 'First Name' 
    }, 
    { 
     width: '8%', 
     field: 'Status', 
     displayName: 'Status' 
    }, 
    { 
     width: '6%', 
     field: "actions", 
     displayName: "Actions", 
     cellTemplate: '<a href="#" title="test" class="Icon"></a>' 
    } 
    ] 
}; 

とJS

で

var app = angular.module("finApp", ["ui.grid"]); 
    app.controller(
      "finController", 
      function($scope,$http){ 
       $http.get("url","data") 
        .then(function(response) { 
         $scope.gridOptions.data =response.data; 

       },function(errorResponse) { 
     }); 
    }); 

参照先：UI GRID