我正在使用Knockout.js构建一个购物车系统。目前,我将“Orders”存储在名为lineItems的observableArray中,并使用knockout foreach生成包含所有必需表单输入的表行。
<tbody data-bind="foreach: lineItems">
<tr>
<td><input data-bind="value: upc" name="Orders.upc"></td>
<td><input data-bind="value: name" value="Orders.name"></td>
...
</tr>
</tbody>
一切都运行得很好,但是,我想编辑每个表单输入的name属性,以便knockout的foreach循环添加的每一行都有一个唯一的名称。具体来说,我正在尝试更改结束HTML:
<tr>
<td><input data-bind="value: upc" name="Orders.upc"></td>
<td><input data-bind="value: name" value="Orders.name"></td>
...
</tr>
<tr>
<td><input data-bind="value: upc" name="Orders.upc"></td>
<td><input data-bind="value: name" value="Orders.name"></td>
...
</tr>
对此:
<tr>
<td><input data-bind="value: upc" name="Orders.0.upc"></td>
<td><input data-bind="value: name" value="Orders.0.name"></td>
...
</tr>
<tr>
<td><input data-bind="value: upc" name="Orders.1.upc"></td>
<td><input data-bind="value: name" value="Orders.1.name"></td>
...
</tr>
我真的不确定如何解决这个问题(我是淘汰赛的新手)。我想我需要使用属性绑定和$ index上下文,但我不知道如何去做。
答案 0 :(得分:2)
您可以使用attr绑定...
<tbody data-bind="foreach: lineItems">
<tr>
<td><input data-bind="value: upc, atrr: {name: 'Orders.' + $index() + '.upc'}"></td>
<td><input data-bind="value: name, atrr: {name: 'Orders.' + $index() + '.name'}"></td>
</tr>
</tbody>