簡體   English   中英

顯示從 Nodejs 到 EJS 的嵌套 JSON

[英]Displaying Nested JSON from Nodejs to EJS

我打開了 1000 個瀏覽器選項卡,但似乎無法找到預期的信息。

服務器.js
在服務器中,我正在運行它以從我的 neo4j 數據庫中獲取數據:

app.get('/ios', async (req, res) => {
  try {
const iosUberResult = await session.run(`MATCH p=(ios:IOS {name: 'UofO'})-->(ios2:CampBus)<--(ios3:SchColUnit)<--(ios4:Dept)
    With collect(p) as p2
    CALL apoc.convert.toTree(p2, true, {
        nodes: {IOS: ['name'], CampBus: ['name'], SchColUnit: ['name'], Dept: ['name']}
    }) yield value
    Return value`); 
const iosUberArr = iosUberResult.records.map(({_fields}) => {
      return {iosUber: _fields[0] };
   });
    res.render('ios', {
    iosUber:iosUberArr
   });
console.log(iosUberArr); //this does not show the entire json as hoped
  } catch(e) {
    console.log("Something went wrong", e)
  }
});

密碼查詢結果
應該注意的是,上面看到的密碼查詢返回有效的 json。 這是嵌套的 json 層次結構:
家長:UofO
孩子:CampBus
孫子:SchColUnit
曾孫:系
這是在 neo4j 瀏覽器上運行時返回的值:

{
  "_type": "IOS",
  "name": "UofO",
  "_id": 116059,
  "has_campbus": [
    {
      "date": "11/08/2021",
      "Uid": "5dad1d22-40c3-11ec-973a-0242ac130003",
      "has_schcolunit": [
        {
          "date": "11/08/2021",
          "Uid": "af76d77e-40c3-11ec-973a-0242ac130003",
          "level": 3,
          "has_dept": [
            {
              "_type": "IOS:Dept",
              "date": "11/08/2021",
              "name": "AAA Department 1",
              "Uid": "e057114c-40c3-11ec-973a-0242ac130003",
              "_id": 116068,
              "level": 4
            },
            {
              "_type": "IOS:Dept",
              "date": "11/09/2021",
              "name": "AAA Department 9",
              "Uid": "135acc0c-cb13-4bcd-8edf-1c7737123a64",
              "_id": 116099,
              "level": 4
            }
          ],
          "_type": "IOS:SchColUnit",
          "name": "AAA School College Unit  1",
          "_id": 116064
        },
        {
          "date": "11/08/2021",
          "Uid": "af76dad0-40c3-11ec-973a-0242ac130003",
          "level": 3,
          "has_dept": [
            {
              "_type": "IOS:Dept",
              "date": "11/09/2021",
              "name": "AAA Department 10",
              "Uid": "9f234e53-fe7b-4c33-b50d-a130c8867f88",
              "_id": 116100,
              "level": 4
            },
            {
              "_type": "IOS:Dept",
              "date": "11/08/2021",
              "name": "AAA Department 2",
              "Uid": "e0571354-40c3-11ec-973a-0242ac130003",
              "_id": 116069,
              "level": 4
            }
          ],
          "_type": "IOS:SchColUnit",
          "name": "AAA School College Unit  2",
          "_id": 116065
        }
      ],
      "level": 2,
      "_type": "IOS:CampBus",
      "name": "AAA Campus",
      "_id": 116060
    },
    {
      "date": "11/08/2021",
      "Uid": "5dad1fca-40c3-11ec-973a-0242ac130003",
      "has_schcolunit": [
        {
          "date": "11/08/2021",
          "Uid": "db29357c-fac4-40f4-b277-dbc100e8ee1f",
          "level": 3,
          "has_dept": [
            {
              "_type": "IOS:Dept",
              "date": "11/08/2021",
              "name": "BBB Department 5",
              "Uid": "ca1b0684-2cfe-4fb2-8274-8945116d9db5",
              "_id": 116083,
              "level": 4
            },
            {
              "_type": "IOS:Dept",
              "date": "11/09/2021",
              "name": "BBB Department 13",
              "Uid": "c2f292c7-9413-4682-80f5-c31f53f35f4b",
              "_id": 116103,
              "level": 4
            }
          ],
          "_type": "IOS:SchColUnit",
          "name": "BBB School College Unit  5",
          "_id": 116079
        },
        {
          "date": "11/08/2021",
          "Uid": "95a7f2e0-9fe8-4c75-8393-64d6e517fa73",
          "level": 3,
          "has_dept": [
            {
              "_type": "IOS:Dept",
              "date": "11/08/2021",
              "name": "BBB Department 6",
              "Uid": "362a0b56-4614-4152-b6b2-bb9e086618fa",
              "_id": 116084,
              "level": 4
            },
            {
              "_type": "IOS:Dept",
              "date": "11/09/2021",
              "name": "BBB Department 14",
              "Uid": "f27907f3-f28f-44e9-8e7a-95f4704e6143",
              "_id": 116104,
              "level": 4
            }
          ],
          "_type": "IOS:SchColUnit",
          "name": "BBB School College Unit  6",
          "_id": 116080
        }
      ],
      "level": 2,
      "_type": "IOS:CampBus",
      "name": "BBB Campus",
      "_id": 116061
    },
    {
      "date": "11/08/2021",
      "Uid": "5dad2100-40c3-11ec-973a-0242ac130003",
      "has_schcolunit": [
        {
          "date": "11/08/2021",
          "Uid": "af76dc06-40c3-11ec-973a-0242ac130003",
          "level": 3,
          "has_dept": [
            {
              "_type": "IOS:Dept",
              "date": "11/09/2021",
              "name": "CCC Department 11",
              "Uid": "f96f929d-15fc-4861-9d28-95f3c7cc604f",
              "_id": 116101,
              "level": 4
            },
            {
              "_type": "IOS:Dept",
              "date": "11/08/2021",
              "name": "CCC Department 3",
              "Uid": "e057143a-40c3-11ec-973a-0242ac130003",
              "_id": 116070,
              "level": 4
            }
          ],
          "_type": "IOS:SchColUnit",
          "name": "CCC School College Unit  3",
          "_id": 116066
        },
        {
          "date": "11/08/2021",
          "Uid": "af76dcd8-40c3-11ec-973a-0242ac130003",
          "level": 3,
          "has_dept": [
            {
              "_type": "IOS:Dept",
              "date": "11/09/2021",
              "name": "CCC Department 12",
              "Uid": "95f9b946-8cad-4471-a8a5-87809921f54e",
              "_id": 116102,
              "level": 4
            },
            {
              "_type": "IOS:Dept",
              "date": "11/08/2021",
              "name": "CCC Department 4",
              "Uid": "e05714f8-40c3-11ec-973a-0242ac130003",
              "_id": 116071,
              "level": 4
            }
          ],
          "_type": "IOS:SchColUnit",
          "name": "CCC School College Unit  4",
          "_id": 116067
        }
      ],
      "level": 2,
      "_type": "IOS:CampBus",
      "name": "CCC Campus",
      "_id": 116062
    },
    {
      "date": "11/08/2021",
      "Uid": "5dad220e-40c3-11ec-973a-0242ac130003",
      "has_schcolunit": [
        {
          "date": "11/08/2021",
          "Uid": "97068992-6457-4897-9c4c-b8397fc72fde",
          "level": 3,
          "has_dept": [
            {
              "_type": "IOS:Dept",
              "date": "11/08/2021",
              "name": "DDD Department 7",
              "Uid": "406a92e6-a8ea-43c8-9043-2ceb3d9d4428",
              "_id": 116085,
              "level": 4
            },
            {
              "_type": "IOS:Dept",
              "date": "11/09/2021",
              "name": "DDD Department 15",
              "Uid": "6570ecfc-86c1-4f60-bd43-d33036b6480f",
              "_id": 116105,
              "level": 4
            }
          ],
          "_type": "IOS:SchColUnit",
          "name": "UW Med School College Unit 7",
          "_id": 116081
        },
        {
          "date": "11/08/2021",
          "Uid": "e3bc099e-a006-4f6a-ab8a-f20e5a438ca5",
          "level": 3,
          "has_dept": [
            {
              "_type": "IOS:Dept",
              "date": "11/08/2021",
              "name": "DDD Department 8",
              "Uid": "c794b1ce-34d9-414d-9579-a01e79767392",
              "_id": 116086,
              "level": 4
            },
            {
              "_type": "IOS:Dept",
              "date": "11/09/2021",
              "name": "DDD Department 16",
              "Uid": "d6b8c84f-0bde-4fcb-ac2d-c021c395370e",
              "_id": 116106,
              "level": 4
            }
          ],
          "_type": "IOS:SchColUnit",
          "name": "DDD School College Unit 8",
          "_id": 116082
        }
      ],
      "level": 2,
      "_type": "IOS:CampBus",
      "name": "DDD Campus",
      "_id": 116063
    }
  ]
}

ios.ejs
在我的 ios.ejs 頁面上,我嘗試將數據iosUber 移植到表單中的位置如下:

                    <form id="Is-LocatedForm" method="get"  class="lb-lg form-margin ">

                        <label>Level 1</label><br>
                        <select id="" class="form-control" type="text">
                            <% iosUber.forEach(function(lev){ %>
                                <option ><%= lev.name %></option>
                            <% }) %>
                        </select>
                        <br>
                        <label>Level 2</label><br>
                        <select id="" class="form-control" type="text">
                                <% iosUber.has_campbus.forEach(function(lev){ %>
                                    <option ><%= lev.name %></option>
                                <% }) %>
                        </select>
                        <br>
                        <label>Level 3</label><br>
                        <select id="" class="form-control" type="text">
                            <% iosUber.has_schcolunit.forEach(function(lev){ %>
                                <option ><%= lev.name %></option>
                            <% }) %>
                        </select>
                        <br>
                        <label>Level 4</label><br>
                        <select id="" class="form-control" type="text">
                            <% iosUber.has_dept.forEach(function(lev){ %>
                                <option><%= lev.name %></option>
                            <% }) %>
                        </select>
                    </form>

這種從服務器到客戶端的渲染不起作用,因為我不明白如何在所有級別訪問嵌套的 JSON 對象。 似乎我應該在服務器端和客戶端都使用更多的“點符號”來訪問 JSON 中的嵌套級別,但我似乎找不到合適的組合。

非常感謝您的幫助,

紅色的

如果您嘗試以與檢索數據相同的方式顯示數據,則應嵌套ejs標簽。

您的 JSON 具有以下形狀:

{
  "has_campus": [{
      "has_schoolunit": [{
          "has_dept": []
        }]
    }]
}

所以你的ejs應該是這樣的:

<% iosUber.has_campus.forEach(function(campus) { %>
// Campus HTML
  <% campus.has_schoolunit.forEach(function(unit) { %>
    // Unit HTML
    <% unit.has_dept.forEacth(function(dept) { %>
      // Department HTML
    <% }) %>
  <% }) %>
<% }) %>

您可以看到 JSON 和 EJS 具有相同級別的nestedness

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM