TypeError:使用angular-datatables时无法读取null的属性'parentNode'

时间:2015-07-22 08:01:16

标签: javascript jquery angularjs datatables

我正在尝试使用angular-datatables并收到以下错误:

 - TypeError: Cannot read property 'parentNode' of null while using angular-datatables".
   Note: all index files and dependencies have been included.

view.html

<table datatable="" dt-options="dtOptions" dt-columns="dtColumns" class="row-border hover">
</table>

controller.js

$scope.finalArray = [];
$scope.dtOptions;
$scope.dtColumns;
/*code includes a function call to url to fetch data
after it is successful, it goes to function dt */

 function dt(){
$scope.dtOptions = DTOptionsBuilder.fromFnPromise(function(){return $q.when($scope.finalArray);})
    .withTableTools("bower_components/datatables-tabletools/swf/copy_csv_xls_pdf.swf")
    .withTableToolsButtons([
        'copy',
        'print', {
            'sExtends': 'collection',
            'sButtonText': 'Save',
            'aButtons': ['csv', 'xls', 'pdf']
        }
    ]);
 $scope.dtColumns = [];
    for(var i in $scope.columnTable){    $scope.dtColumns.push(DTColumnBuilder.newColumn($scope.columnTable[i]).withTitle($scope.columnTable[i]));
}
  }

这是我收到的错误消息 错误讯息:

at Object.<anonymous> (jquery.dataTables.min.js:131)
at Object.t.iterator (jquery.dataTables.min.js:96)
at Object.<anonymous> (jquery.dataTables.min.js:131)
at Object.t.extend.g [as destroy] (jquery.dataTables.min.js:99)
at m.fnDestroy (jquery.dataTables.min.js:80)
at HTMLTableElement.<anonymous> (jquery.dataTables.min.js:84)
at Function.n.extend.each (jquery.min.js:2)
at n.fn.n.each (jquery.min.js:2)
at m [as dataTable] (jquery.dataTables.min.js:83)
at h.fn.DataTable (jquery.dataTables.min.js:159)

我该如何解决这个问题?

1 个答案:

答案 0 :(得分:0)

请参阅Mr.MaicolBen here的评论。这可能有所帮助。

“表没有插件,在我看来,当应用指令时表没有准备好。因为当我创建其他指令,在第二次工作后应用插件!但行为很慢:”< / p>

.directive('myDatatable', function($compile, $timeout){
    return function(scope, elem, attr) {
        $timeout(function(){
            elem.attr('datatable', 'ng');
            elem.removeAttr('my-datatable');
            $compile(elem)(scope);
        }, 1000);
  };
})