无法在 handlebars url 方法中迭代对象数组 ID - node.js

Question

使用方法覆盖包、express 和 express-handlebars 在 node.js 中试验 REST http 方法。奇怪的是，我能够使用车把遍历对象数组，但是当我尝试将特定 id 分配给 url 方法时，它只会分配该循环中的第一个项目。

在 html 页面上将显示富 1 小节 2 foobar 3

当单击按钮时，无论选择的是什么按钮，单击按钮后都会显示为：您的 ID 是：1

有人可以指出为什么我的按钮方法 url 没有被分配特定的 ID，即使我的页面可以读取它们吗？

server.js

const express = require('express');
const exphbs = require('express-handlebars');

const methodOverride = require('method-override');


const app = express();
app.use(methodOverride('_method'));

var PORT = process.env.PORT || 3000;

const products = [
    {id: 5, name: 'foo'},
    {id: 2, name: 'bar'},
    {id: 3, name: 'foobar'}
];

app.engine('handlebars', exphbs({
   defaultLayout: 'main'
}));

app.set('view engine', 'handlebars');

app.get('/', (req, res, next) => {
    res.render("index", { products });
});

app.delete('/:id?', (req, res, next) => {
    res.send('your id is: ' + req.params.id);
});

app.listen(PORT, ()=> console.log('This s*** is bananas'));

index.handlebars

<ul>
    {{#each products}}
        <li>{{this.name}}</li>
        <form method="POST" action="/{{this.id}}?_method=DELETE">
        <button type="submit">DELETE</button>
        <form>
    {{/each}}
</ul>

Answer 1

你的问题是你的HTML无效。您在结束表单标记 </form> 中缺少“/”。您的浏览器在尝试理解无效标记时，只呈现第一种形式，其中 action=/1。所有按钮都提交此表单。

无法在 handlebars url 方法中迭代对象数组 ID - node.js

Not able to iterate object array id inside of handlebars url method - node.js

node.js

express

handlebars.js

x-http-method-override

express-handlebars