遍历嵌套的对象数组并添加新行 datatables.net

Question

我目前正在从对象的嵌套数组制作表格。
所以，我决定使用数据表库。
我的问题是我找不到循环数组的方法。如果数组长度大于 1，则添加另一行。

这是我的代码

$(document).ready(function () {
    $('#table-nyadran').DataTable({
        "data": data,
        "columns": [
            {
                "data": "id",
                render: function (data, type, row, meta) {
                    return meta.row + meta.settings._iDisplayStart + 1;
                }
            },
            { "data": "name" },
            { "data": "address" },
            {
                "data": "arwahs.0",
                "render": function (data, type, row, meta) {
                    return data.arwah_type +'. '+ data.arwah_name;
                }
            },
            { "data": "arwahs.0.arwah_address"},
        ]
    });

我可以只使用 jQuery，但我认为数据表更适合这个。

for (i = 0; i < data.length; i++) {
    nomer = i + 1
   
    nyadran_table += "<tr><td>" + nomer + ".</td><td>" + data[i].name + "</td><td>" + data[i].address + "</td>"
    for (k = 0; k < data[i].arwahs.length; k++) {
        if (k > 0) {
            nyadran_table += "<tr class=" + oddeven + "><td colspan=''></td><td></td><td></td><td>" + data[i].arwahs[k].arwah_type + ". " + data[i].arwahs[k].arwah_name + "</td><td>" + data[i].arwahs[k].arwah_address + "</td></tr>"
        } else {
            nyadran_table += "<td>" + data[i].arwahs[k].arwah_type + ". " + data[i].arwahs[k].arwah_name + "</td><td>" + data[i].arwahs[k].arwah_address + "</td></tr>"
        }
    }
}

这是我的数组

    [
  {
    "id": 36,
    "name": "Evelyn Stone",
    "phone": "1 (939) 117-4285",
    "address": "In ab ipsum id labor",
    "created_at": "2022-02-05T22:38:15.000000Z",
    "updated_at": "2022-02-05T22:38:15.000000Z",
    "arwahs": [
      {
        "id": 52,
        "sender_id": 36,
        "arwah_name": "Sydney Dyer",
        "arwah_address": "Optio dolore iusto",
        "arwah_type": "Saudara",
        "created_at": "2022-02-05T22:38:15.000000Z",
        "updated_at": "2022-02-05T22:38:15.000000Z"
      },
      {
        "id": 53,
        "sender_id": 36,
        "arwah_name": "Aretha Byers",
        "arwah_address": "Eu consectetur qui u",
        "arwah_type": "Saudara",
        "created_at": "2022-02-05T22:38:15.000000Z",
        "updated_at": "2022-02-05T22:38:15.000000Z"
      },
      {
        "id": 54,
        "sender_id": 36,
        "arwah_name": "Suki Dillard",
        "arwah_address": "Excepturi molestias",
        "arwah_type": "Saudara",
        "created_at": "2022-02-05T22:38:15.000000Z",
        "updated_at": "2022-02-05T22:38:15.000000Z"
      }
    ]
  },
  {
    "id": 37,
    "name": "Jeremy Browning",
    "phone": "1 (393) 741-9987",
    "address": "Et illo nihil sapien",
    "created_at": "2022-02-05T22:38:55.000000Z",
    "updated_at": "2022-02-05T22:38:55.000000Z",
    "arwahs": [
      {
        "id": 55,
        "sender_id": 37,
        "arwah_name": "Hermione Mcgowan",
        "arwah_address": "Aliqua Aut eum in u",
        "arwah_type": "Saudara",
        "created_at": "2022-02-05T22:38:55.000000Z",
        "updated_at": "2022-02-05T22:38:55.000000Z"
      },
      {
        "id": 56,
        "sender_id": 37,
        "arwah_name": "Carlos Dudley",
        "arwah_address": "Nulla reprehenderit",
        "arwah_type": "Ibu",
        "created_at": "2022-02-05T22:38:55.000000Z",
        "updated_at": "2022-02-05T22:38:55.000000Z"
      }
    ]
  },
  {
    "id": 38,
    "name": "Wallace Dorsey",
    "phone": "1 (848) 278-3114",
    "address": "Commodi ipsum et sa",
    "created_at": "2022-02-05T22:39:26.000000Z",
    "updated_at": "2022-02-05T22:39:26.000000Z",
    "arwahs": [
      {
        "id": 57,
        "sender_id": 38,
        "arwah_name": "Felix Lester",
        "arwah_address": "In ullam magni offic",
        "arwah_type": "Saudara",
        "created_at": "2022-02-05T22:39:26.000000Z",
        "updated_at": "2022-02-05T22:39:26.000000Z"
      },
      {
        "id": 58,
        "sender_id": 38,
        "arwah_name": "Jael Porter",
        "arwah_address": "Delectus esse dolo",
        "arwah_type": "Saudara",
        "created_at": "2022-02-05T22:39:26.000000Z",
        "updated_at": "2022-02-05T22:39:26.000000Z"
      },
      {
        "id": 59,
        "sender_id": 38,
        "arwah_name": "Charity Maldonado",
        "arwah_address": "Perferendis sed qui",
        "arwah_type": "Saudara",
        "created_at": "2022-02-05T22:39:26.000000Z",
        "updated_at": "2022-02-05T22:39:26.000000Z"
      },
      {
        "id": 60,
        "sender_id": 38,
        "arwah_name": "Xerxes Vance",
        "arwah_address": "Et ea quos aut hic c",
        "arwah_type": "Bapak",
        "created_at": "2022-02-05T22:39:26.000000Z",
        "updated_at": "2022-02-05T22:39:26.000000Z"
      }
    ]
  }
]

当前输出

预期输出

任何线索或答案。我很感激。谢谢

Answer 1

已解决。 datatables 不支持 colspan。所以，我只是制作基本的 table.

遍历嵌套的对象数组并添加新行 datatables.net

looping through nested array of object and add new row datatables.net

jquery

datatables