angularjs - 306_expandable_grid - 无法读取 'data' 的属性未定义

Question

我正在研究 ui-grid 和 306_expandable_grid ，我使用了文档中的确切代码，但我遇到了错误问题。

应用程序.js

$http.get('resources/data/title2.json')
    .success(function(data){

        console.log(data);
        console.log(data[0].Data);
        console.log(data.length);
        for(i = 0; i < data[i].length; i++){
           data[i].subGridOptions = {
                  columnDefs: [ 
                    {name:"Title" },
                    {name:"Jan-10" },
                    {name:"Feb-10"},
                    {name:"Mar-10" },
                    {name:"Apr-10" },
                    {name:"May-10" },
                    {name:"Jun-10" },
                    {name:"Jul-10" },
                    {name:"Aug-10" },
                    {name:"Sep-10" },
                    {name:"Oct-10" },
                    {name:"Nov-10" },
                    {name:"Dec-10" }
                ],
              data: data[i].Data
          }
      }
        // $scope.subGridOptions.data = data;
        $scope.gridOptions.data = data;
        // $scope.title = data[0].Title;
    });

外部HTML文件.html

<div ui-grid="row.entity.subGridOptions" style="height:150px;"></div>

这是我遇到的错误

 TypeError: Cannot read property 'data' of undefined
    at new <anonymous> (http://localhost/ng-Grid/resources/scripts/ui-grid-unstable.js:2883:41)
    at Object.e [as invoke] (http://localhost/ng-Grid/resources/scripts/angular.min.js:36:456)
    at E.instance (http://localhost/ng-Grid/resources/scripts/angular.min.js:75:118)
    at http://localhost/ng-Grid/resources/scripts/angular.min.js:58:276
    at r (http://localhost/ng-Grid/resources/scripts/angular.min.js:7:408)
    at M (http://localhost/ng-Grid/resources/scripts/angular.min.js:58:260)
    at http://localhost/ng-Grid/resources/scripts/angular.min.js:65:412
    at http://localhost/ng-Grid/resources/scripts/angular.min.js:109:276
    at h.$eval (http://localhost/ng-Grid/resources/scripts/angular.min.js:123:139)
    at h.$digest (http://localhost/ng-Grid/resources/scripts/angular.min.js:120:220)

当我单击加号图标时，出现错误...我找不到我能理解的解决方案。请帮忙

Answer 1

首先，确保您初始化 $scope.gridOptions $http.get 之外success打回来。只添加 $scope.gridOptions.data[i].subGridOptions至 $scope.gridOptions内success打回来。 Reference :

You can't define the grid options in the success call. You need to define them on the scope in your controller and then set the data or column definitions, etc... from the success call.

其次，确保网格/页面的 Controller 没有任何类型的依赖于初始化参数的重定向。由于页面上的以下代码段，我遇到了相同的错误消息:

if (typeof clientcode === 'string' && clientcode !== '') {

    var payload = {
        clientcode : storedClientcode
    }

} else {

    $location.path('/');

}

这里的想法是检查 storedClientcode 是否存在由调用页面提供(通过共享应用根服务)，如果没有，则重定向到应用程序主页。但是 ui-grid 显然对位于 上的页面进行了单独的子调用，并且这些子调用当然不会提供我在代码中寻找的数据，因此重定向发生在这些调用的幕后。没有产生任何错误(除了您所看到的)，并且网格中没有显示任何数据。这花了我一些时间才弄明白(我对 AngularJS 还是很陌生，这是 ui-grid 对我来说的第一个应用程序)。希望这会对某人有所帮助，即使它没有解决这个问题。