在 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

您不应从视图中检索数据。因此，当您在后端检索到它时，您将代表您的数据的 JavaScript 对象（如您在问题中引用的数据）从业务层传递给 EJS。我不知道你用什么作为后端框架。例如，当使用 NodeJS 时：

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

然后，在你看来，你通过JavaScript遍历对象：

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

Retrieve local JSON file data in EJS template