Javascript 展开和折叠数据表中的子行

在Shining中复制datatable对象时遇到问题。目前，当我在一个闪亮的环境之外运行代码的数据表部分时，我可以显示我想要的内容。但是，当我运行整个代码时，它不会显示子表

library(DT)
library(data.table)
library(shiny)

shinyApp(
 ui = fluidPage(DT::dataTableOutput('tbl')),
 server = function(input, output) {
 output$tbl = DT::renderDataTable(

  datatable({
    #Transform dataframe to data.table and turn the dataframe rowname into a data.table column called model
    mtcars_dt = data.table(mtcars)
    mtcars_dt[["model"]] = rownames(mtcars)
    setcolorder(mtcars_dt,c(
      which(colnames(mtcars_dt) %in% c("mpg","cyl","model")),
      which(!colnames(mtcars_dt) %in% c("mpg","cyl","model"))
    ))

    #Turn data table into a nested data.table by mpg, cyl
    mtcars_dt <- mtcars_dt[, list(cars=list(.SD)), by = list(mpg,cyl)]


    #configure datatable. Hide row number and cars columns [0,4] and enable details control on plus sign column[1]
    #turn rows into child rows and remove from parent
    cbind(' ' = '&oplus;', mtcars_dt)}, 

    escape = -2,
    options = list(
      columnDefs = list(
        list(visible = FALSE, targets = c(0,4)),
        list(orderable = FALSE, className = 'details-control', targets = 1)
      )
    ),
    callback = JS("
                  table.column(1).nodes().to$().css({cursor: 'pointer'});

                  // Format cars object into another table
                  var format = function(d) {
                  if(d != null){ 
                  var result = ('<table id=\"child_' + d[2] + '_' + d[3] + '\">').replace('.','_') + '<thead><tr>'
                  for (var col in d[4]){
                  result += '<th>' + col + '</th>'
                  }
                  result += '</tr></thead></table>'
                  return result
                  }else{
                  return '';
                  }
                  }

                  var format_datatable = function(d) {
                  var dataset = [];
                  for (i = 0; i < + d[4]['model'].length; i++) {
                  var datarow = [];
                  for (var col in d[4]){
                  datarow.push(d[4][col][i])
                  }
                  dataset.push(datarow)
                  }
                  var subtable = $(('table#child_' + d[2] + '_' + d[3]).replace('.','_')).DataTable({
                  'data': dataset,
                  'autoWidth': true, 
                  'deferRender': true, 
                  'info': false, 
                  'lengthChange': false, 
                  'ordering': true, 
                  'paging': false, 
                  'scrollX': false, 
                  'scrollY': false, 
                  'searching': false 
                  });
                  };

                  table.on('click', 'td.details-control', function() {
                  var td = $(this), row = table.row(td.closest('tr'));
                  if (row.child.isShown()) {
                  row.child.hide();
                  td.html('&oplus;');
                  } else {
                  row.child(format(row.data())).show();
                  td.html('&CircleMinus;');
                  format_datatable(row.data())
                  }
                  });")
      )
    )
  }
)

库（DT）
库（数据表）
图书馆（闪亮）
shinyApp(
ui=fluidPage（DT:：dataTableOutput（'tbl'），
服务器=功能（输入、输出）{
输出$tbl=DT:：renderDataTable(
数据表({
#将dataframe转换为data.table，并将dataframe行名转换为名为model的data.table列
mtcars_dt=数据表（mtcars）
mtcars_dt[[“模型”]=行名称（mtcars）
设置着色器（mtcars\U dt，c(
其中（以%c（“mpg”、“cyl”、“model”）表示的列名称（mtcars_dt）%，
其中（！colnames（mtcars_dt）%in%c（“mpg”、“cyl”、“model”））
))
#按mpg、cyl将数据表转换为嵌套数据表
mtcars_dt这里的关键似乎是对象和数组之间的区别。使用shiny时，
row.data（）
是一个数组，它的第五个元素也是一个数组（这里我单击了主表中的第二行）：

在闪亮的环境之外，
row.data（）
如下所示：

["2", "⊕", 22.8, 4, Object]

正如你所看到的，第五个元素是一个对象！为什么会这样，我说不出来。我想在幕后使用的库的版本可能会有所不同

要使其正常工作，我们需要进行两项更改：

1.更改
格式（）
：


在这里，我们使用
$.map（）
将每个汽车模型（因此
d[4]
中的每个元素）转换为一个数组，然后我们将该数组添加到
数据集

创建子表的代码需要这些数组。数据表处理数据的方式与其可检查的类型不同

["2", "⊕", 22.8, 4, Object]

var format = function(d) {
  if(d != null) { 
    var result = ('<table id=\"child_' + d[2] + '_' + d[3] + '\">').replace('.','_') + '<thead><tr>'
    for (var col in d[4][0]) {
       result += '<th>' + col + '</th>'
    }
    result += '</tr></thead></table>'
    return result
  } else {
    return '';
  }
}

var format_datatable = function(d) {
  var dataset = [];
  for (i = 0; i <=  d[4].length-1; i++) {
    var datarow = $.map(d[4][i], function(value, index) {
      return [value];
    });
    dataset.push(datarow);
  }
  //  ...
  //  the rest did not change
}