nodejs用ejsforEach对象表示并放入表中

Question

你好，我今天刚刚开始学习node js，我正在尝试为每个对象创建一个对象并将其放入一个表中。

在我的路由器中：

var obj = JSON.parse(`[{
"Name": "ArrowTower",
"Class": "ArrowTower",
"GoldCosts": [0, 100, 200, 600, 1200, 2000, 8000, 35000],
"WoodCosts": [5, 25, 30, 40, 50, 70, 300, 800],
"StoneCosts": [5, 20, 30, 40, 60, 80, 300, 800],
"TokenCosts": [0, 0, 0, 0, 0, 0, 0, 0],
"TowerRadius": [600, 650, 700, 750, 800, 850, 900, 1000],
"MsBetweenFires": [400, 333, 285, 250, 250, 250, 250, 250],
"Height": 95.99,
"Width": 95.99,
"Health": [150, 200, 400, 800, 1200, 1600, 2200, 3600],
"MsBeforeRegen": [10000, 10000, 10000, 10000, 10000, 10000, 10000, 10000],
"HealthRegenPerSecond": [2, 5, 10, 20, 40, 80, 110, 150],
"DamageToZombies": [20, 40, 70, 120, 180, 250, 400, 500],
"DamageToPlayers": [5, 5, 5, 5, 5, 5, 6, 6],
"DamageToPets": [5, 5, 5, 5, 5, 5, 6, 6],
"DamageToNeutrals": [250, 350, 450, 550, 650, 750, 850, 1000],
"ProjectileLifetime": [1300, 1300, 1300, 1300, 1300, 1300, 1300, 1300],
"ProjectileVelocity": [60, 65, 70, 70, 75, 80, 120, 140],
"ProjectileName": "ArrowProjectile",
"ProjectileAoe": [false, false, false, false, false, false, false, false],
"ProjectileCollisionRadius": [10, 10, 10, 10, 10, 10, 10, 10]
}]`)
router.get('/info', (req, res) => {
res.render("info", { obj: obj });
});

在我的ejs文件中，我尝试过：

<table id="table">
<tr>
<td>Tier</td>
<td>Velocity</td>
<td>Reload</td>
<td>Damage</td>
<td>Health regen/s</td>
</tr>

<% Object.values(obj).forEach(function(tower){%>
<tr>
<td>Tier </td>
<td><%= tower.ProjectileVelocity %></td>
<td><%= tower.MsBetweenFires %></td>
<td><%= tower.DamageToZombies %></td>
<td><%= tower.HealthRegenPerSecond %></td>
</tr>
<%})%>
</table>

上面的输出尝试：上方输出的图像

我也试过：

<% Object.values(obj).forEach(function(tower){%>
<tr>
<td>Tier </td>
<td><%= tower['ProjectileVelocity'][0] %></td>
<td><%= tower['MsBetweenFires'][0] %></td>
<td><%= tower['DamageToZombies'][0] %></td>
<td><%= tower['HealthRegenPerSecond'][0] %></td>
</tr>
<%})%>

上面的输出尝试：上方输出的图像

我正在努力实现的目标：我想实现的图像

我似乎不知道如何像上面的图片一样，或者是否可以做到。

Answer 1

您必须为每一行添加一个额外的循环。如果确定所有阵列属性都具有相同的长度，则可以根据阵列长度(例如ProjectileVelocity阵列长度(使用for或forEach循环。

<table id="table">
<tr>
<td>Tier</td>
<td>Velocity</td>
<td>Reload</td>
<td>Damage</td>
<td>Health regen/s</td>
</tr>

<% Object.values(obj).forEach(function(tower){%>
<% for (let i = 0; i < tower.ProjectileVelocity.length; i++) { %>
<tr>
<td>Tier </td>
<td><%= tower.ProjectileVelocity[i] %></td>
<td><%= tower.MsBetweenFires[i] %>ms</td>
<td><%= tower.DamageToZombies[i] %></td>
<td><%= tower.HealthRegenPerSecond[i] %></td>
</tr>
<%  } %>
<%})%>
</table>