使用EJS模板开发To-Do-List应用无法新增表单提交的列表项求助

问题原因 #

存在两处拼写错误导致功能失效：

• list.ejs模板中，数组长度属性拼写错误：lenth 应为 length，该错误会导致遍历新增列表项的循环直接不执行，即使后端传递了数据也无法渲染到页面
• App.js的POST请求处理逻辑中，获取表单字段的键名拼写错误：表单input的name属性为newItem（首字母I大写），但代码中使用了req.body.newitem（i小写），导致读取到的值为undefined，无法将有效内容存入数组

修复方案 #

1. 替换list.ejs中的循环代码：

<% for(var i=0;i<newListItems.length; i++){ %>
    <li> <%= newListItems[i] %></li>
<% } %>

2. 替换App.js中的POST路由代码：

app.post("/", function (req, res) {
  var item = req.body.newItem;
  items.push(item);
  res.redirect("/");
});

修改完成后重启服务即可正常通过表单新增列表项。

内容的提问来源于stack exchange，提问作者DEVSBA6996