将字符串化的JSON数据呈现到表中

Question

我正在尝试从本地JSON文件显示all document Names。当我尝试渲染数据时，它显示为undefined.。但是，在控制台中，我可以看到所有数据。

据我所知，for循环看起来很好，所以我想知道问题的根源是否在于"Titles": obj.File.Name。除此之外，我不确定。

---

JS文件：

loadTableData() {
    let tableRes = redactedName.d.results.filter(function(val) { 
      return (val.FileLeafRef.trim().length > 0);
    }).map(function(obj) {

      return {
        // "FileName": obj.FileLeafRef,
        // "Path": obj.EncodedAbsUrl,
        "Titles": obj.File.Name
        }
      });

    let allTitles = tableRes;

    for (var i = 0; i < allTitles.length; i++) {
      let tr = $("<tr/>");
        $(tr).append("<td>" + allTitles.Name + "</td>");
        $("#km-table-id").append(tr)
    };
}

---

JSON代码段

{
  "d": {
    "results": [
      {
        "__metadata": {
          ...
        },
        "File": {
          "__metadata": {
            ...
          },
          "Name": "Guide to Product IDs.docx" <---------------------------
        },
        "FileLeafRef": "Guide to Product IDs.docx",
        "ResourceType": {
          ...
          },
          "results": [
            {
              ...
            }
          ]
        },
        "EncodedAbsUrl": [redacted]
      },
...
...

---

这是我在控制台中看到的示例：

(491) [{…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, …]
[0 … 99]
0: {Titles: "Guide to Product IDs.docx"}
1: {Titles: "Template 1.docx"}

Answer 1

这是一个数组，因此您需要使用索引访问其每个元素。另外，在map中，您将返回Titles属性。所以应该是：

for (var i = 0; i < allTitles.length; i++) {
    let tr = $("<tr/>");
    $(tr).append("<td>" + allTitles[i].Titles + "</td>"); //Change in this line
    $("#km-table-id").append(tr)
};