在EJS中遍历JSON

一尘不染

在EJS中遍历JSON

node.js

我在下面的EJS中有代码，

<script>
    var row =<%-JSON.stringify(data)%>
    console.log(row);
</script>
<% for(var i=0; i<JSON.stringify(data).length; i++) {%>
   <tr>
     <td>
       <%= JSON.stringify(data)[i].id%>
     </td>
   </tr>
<% } %>

行的输出是正确的，由3个对象组成的数组，每个对象具有属性ID，名称等。我可以操纵行以在JS中填充表格。但是，我想知道是否有一种方法可以通过上述方式完成？

当我运行上面的代码时，JSON.stringify（data）.length不是3，而是整个字符串的长度。

另一个问题是当我尝试添加

<％警报（’t’）; ％>或<％window.alert（’t’）; ％>，它给我“未定义”错误…

帮助赞赏。

关于锤子

阅读 595

2020-07-07

共1个答案

一尘不染

JSON.stringify返回String。因此，例如：

var data = [
    { id: 1, name: "bob" },
    { id: 2, name: "john" },
    { id: 3, name: "jake" },
];

JSON.stringify(data)

将返回等价于：

"[{\"id\":1,\"name\":\"bob\"},{\"id\":2,\"name\":\"john\"},{\"id\":3,\"name\":\"jake\"}]"

作为String价值。

所以当你有

<% for(var i=0; i<JSON.stringify(data).length; i++) {%>

最终看起来像是：

<% for(var i=0; i<"[{\"id\":1,\"name\":\"bob\"},{\"id\":2,\"name\":\"john\"},{\"id\":3,\"name\":\"jake\"}]".length; i++) {%>

这可能不是您想要的。什么你可能做的想是这样的：

<table>
<% for(var i=0; i < data.length; i++) { %>
   <tr>
     <td><%= data[i].id %></td>
     <td><%= data[i].name %></td>
   </tr>
<% } %>
</table>

这将输出下表（使用data上面的示例）：

<table>
  <tr>
    <td>1</td>
    <td>bob</td>
  </tr>
  <tr>
    <td>2</td>
    <td>john</td>
  </tr>
  <tr>
    <td>3</td>
    <td>jake</td>
  </tr>
</table>

2020-07-07