我正在使用 Knockout.js 构建购物车系统。目前,我将“订单”存储在一个名为 lineItems 的 observableArray 中,并使用一个删除 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>
一切正常,但是,我想编辑每个表单输入的名称属性,以便由 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>
我真的不确定该怎么做(我是 knockout.js 的新手)。我在想我需要将属性绑定(bind)与 $index 上下文一起使用,但我不确定该怎么做。
最佳答案
你可以使用attr
绑定(bind)...
<tbody data-bind="foreach: lineItems">
<tr>
<td><input data-bind="value: upc, attr: {name: 'Orders.' + $index() + '.upc'}"></td>
<td><input data-bind="value: name, attr: {name: 'Orders.' + $index() + '.name'}"></td>
</tr>
</tbody>
关于Knockout.js 3.1.0 使用 $index 上下文绑定(bind)输入名称和 ID 属性,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24829704/