javascript - 在EJS模板中检索本地JSON文件数据

Question

我的项目如下所示:

views/
    layout.ejs
data/
    US-states.json
public/
    index.html

US-states.json 看起来像这样

{
    "DC": "District of Colombia",
    "NY": "New York",
    etc...
}

如何将此 json 数据拉入 layout.ejs 中以在这样的循环中渲染一些 div？

<div>DC: District of Colombia</div>
<div>NY: New York</div>

我尝试了类似的方法，但在谷歌上搜索解决方案时遇到问题:

var data = JSON.parse('./../data/US-states.json')
<% for(var p in data) {%>
   <div>p: data[p]</div>
<% } %>

Answer 1

您不应从 View 中检索数据。因此，当您在后端检索它时，您将表示您的数据的 JavaScript 对象(如您在问题中引用的那样)从业务层传递给 EJS。我不知道你使用什么作为后端框架。例如，当使用 NodeJS 时:

response.render("yourEJS", {data: yourObject});

然后，在您看来，您通过 JavaScript 遍历该对象:

<% for (aProperty in data) { %>
    <div> <% aProperty %>: <%data[aProperty]%> </div>
<% } %>