TypeError:无法设置未定义的属性'gridDim'

时间:2014-08-20 12:28:44

标签: angularjs ng-grid

   below is my code controller in angular js and html when run this am getting gridDim undefined error please help in resolving the issue---------------
----------------------------------------------------


<div ng-contoller="WritebackgridCtrl">  
        <div class="writebackgridStyle" ng-grid="gridOptions"></div>
</div>

js代码使用控制器和anguar js ....................................... ....... .................................................. ........................

 angular.module('testApp', ['ngGrid'])
      .controller('WritebackgridCtrl', function ($scope,$http,$rootscope) {
            $scope.myData = []; 

    $scope.myData = [{ column1:'1-07-2013', column2: 2013, column3: 'ww2', column4: 'oregon', column5:'325152', column6:'testvalue1', column7:'399', column8:"10", column9:"20", column10:"20", column11:'12'},
                        { column1: '1-08-2013', column2: 2013, column3: 'ww3', column4: 'oregon', column5:'325152', column6:'testvalue2', column7:'299', column8:"20", column9:"32", column10:"32", column11:'12'},
                        { column1: '1-09-2013', column2: 2013, column3: 'ww3', column4: 'oregon', column5:'325152', column6:'testvalue3', column7:'499', column8:"30", column9:"34", column10:"34", column11:'13'},
                        { column1: '1-10-2013', column2: 2013, column3: 'ww3', column4: 'oregon', column5:'325152', column6:'testvalue3', column7:'399', column8:"40", column9:"45", column10:"45", column11:'14'},
                        { column1: '1-11-2013', column2: 2013, column3: 'ww3', column4: 'oregon', column5:'325152', column6:'testvalue4', column7:'399', column8:"50", column9:"16", column10:"16", column11:'17'},
                        { column1: '1-12-2013', column2: 2013, column3: 'ww3', column4: 'oregon', column5:'325152', column6:'testvalue5', column7:'399', column8:"60", column9:"16", column10:"16", column11:'18'},
                        { column1: '1-12-2013', column2: 2013, column3: 'ww3', column4: 'oregon', column5:'325152', column6:'testvalue6', column7:'399', column8:"70", column9:"16", column10:"16", column11:'20'},
                        { column1: '1-12-2013', column2: 2013, column3: 'ww3', column4: 'oregon', column5:'325152', column6:'testvalue3', column7:'399', column8:"80", column9:"16", column10:"16", column11:'30'},
                        { column1: '1-12-2013', column2: 2013, column3: 'ww3', column4: 'oregon', column5:'325152', column6:'testvalue3', column7:'399', column8:"90", column9:"16", column10:"16", column11:'89'},
                        { column1: '1-12-2013', column2: 2013, column3: 'ww3', column4: 'oregon', column5:'325152', column6:'testvalue3', column7:'399', column8:"90", column9:"16", column10:"16", column11:'67'},
                        { column1: '1-12-2013', column2: 2013, column3: 'ww3', column4: 'oregon', column5:'325152', column6:'testvalue3', column7:'399', column8:"90", column9:"16", column10:"16", column11:'78'},
                        { column1: '1-12-2013', column2: 2013, column3: 'ww3', column4: 'oregon', column5:'325152', column6:'testvalue3', column7:'399', column8:"90", column9:"16", column10:"16", column11:'65'},
                        { column1: '1-12-2013', column2: 2013, column3: 'ww3', column4: 'oregon', column5:'325152', column6:'testvalue3', column7:'399', column8:"90", column9:"69", column10:"69", column11:'66'},
                        { column1: '1-12-2013', column2: 2013, column3: 'ww3', column4: 'oregon', column5:'325152', column6:'testvalue3', column7:'399', column8:"90", column9:"69", column10:"69", column11:'45'},
                        { column1: '1-12-2013', column2: 2013, column3: 'ww3', column4: 'oregon', column5:'325152', column6:'testvalue1', column7:'399', column8:"90", column9:"90", column10:"90", clumn11:'56'}];
    $scope.gridOptions = {
        data: 'myData',
            showColumnMenu:true,
           enablePinning: true,
           enableColumnReordering:true,
           enableCellSelection: true,
            enableRowSelection: true,
            enableCellEditOnFocus: true,
            columnDefs: [{ field: "column1", width: 120,pinned: true },
                        { field: "column2", width: 120,pinned:true},
                        { field: "column3", width: 120,pinned:true,headerCellTemplate: 'views/celltemplate.html',enableCellEdit:false },
                        { field: "column4", width: 120,pinned:true,headerCellTemplate: 'views/celltemplate.html',enableCellEdit:false },
                        { field: "column5", width: 120,pinned:true,headerCellTemplate: 'views/celltemplate.html',enableCellEdit:false },
                        { field: "column6", width: 120,pinned:true,headerCellTemplate: 'views/celltemplate.html',enableCellEdit:false },
                        { field: "column7", width: 120,pinned:true,headerCellTemplate: 'views/celltemplate.html',enableCellEdit:false },
                        { field: "column8", width: 120,pinned:true,headerCellTemplate: 'views/celltemplate.html',enableCellEdit:false },
                        { field: "column9", width: 120,pinned:true,headerCellTemplate: 'views/celltemplate.html',enableCellEdit:false },
                        { field: "column10", width: 120,pinned:true,headerCellTemplate: 'views/celltemplate.html',enableCellEdit:false},
                        { field: "column11", width: 120,pinned:true,headerCellTemplate: 'views/celltemplate.html',enableCellEdit:false }]
        };

      });

以上是要在网格中呈现它的数据

1 个答案:

答案 0 :(得分:0)

您的示例中有几个拼写错误可能导致您的错误。

在html部分应该是:

<div ng-controller="WritebackGridCtrl">  
        <div class="WritebackGridStyle" ng-grid="gridOptions"></div>
</div>

而不是ng-contoller

如果你想在控制器中注入rootcope,它应该是:

app.controller('WritebackGridCtrl', function($scope, $http, $rootScope)

而不是$rootscope(请注意camelcase)。

我已经在你的json中提到了拼写错误,但这不会产生错误。

此外,您应该保持更加一致,并使用WritebackGridCtrlWritebackGridStyle

查看所有有用的内容here