使用可变数据/表头填充DataTables时出现问题

Question

我正在尝试动态填充我的DataTables报告。我的代码还根据DataTables的数据动态生成必要的表头。

当我在index.html中对表格进行硬编码时，我的表格填充得很好。但是，当我使用JavaScript为我的索引生成一个表时，我得到一个工作表，但它不会被填充。控制台中没有错误，并且正确填充了表格数据的对象。

我尝试使用if / else循环仅在生成报告时填充报告。

此外，我将代码分成两个函数，只有在生成报告的函数完成后才运行该函数来填充报告。

两次尝试失败。

生成报告并在完成后填写报告需要做什么？

代码：

function rapport_vullen(){
// generate the report
arrayForHeader = (Object.keys(geojson.features[0].properties))

var genereerTabel = '<table id="report" class="table table-striped table-bordered">';
    genereerTabel += '<thead><tr>'
        for (i= 0; i < arrayForHeader.length; i++){
            genereerTabel += '<th>'+arrayForHeader[i]+'</th>'
        }
    genereerTabel += '</tr></thead><tbody></tbody></table>'

$("#test").html(genereerTabel);
$('#report').DataTable(); 

// fill the report
    arrayTwee = [];
    arrayTwee = arrayTwee.concat(Object.keys(geojson.features[0].properties));
    arrayDrie = arrayTwee.map(function(d) {return {data: d};});
    console.log(arrayDrie);

    $("#rapport").dataTable({
        destroy: true,
        "aaData": geojson.features.map(function(row) { return row.properties; }),
        "columns": arrayDrie
    });
};