在我下面的tbody模板中,如何访问正在呈现的项目的索引?
<table>
<tbody data-bind="foreach:contacts">
<tr class="contactRow" valign="top">
<td><a href="#" data-bind="click: function(){viewModel.removeContact($data)}">Delete</td>
<td><input data-bind="value: FirstName" name="Contacts[].FirstName"/></td>
<td><input data-bind="value: LastName" name= "Contacts[].LastName" /></td>
<td><input data-bind="value: Username" name="Contacts[].Username"/></td>
<td><input data-bind="value: Email" name="Contacts[].Email"/></td>
</tr>
</tbody>
<thead>
<tr>
<th>Controls</th>
<th>First Name</th>
<th>Last Name</th>
<th>Username</th>
<th>Email</th>
</tr>
</thead>
</table>
答案 0 :(得分:17)
更新:$index
现已在KO 2.1中提供。
目前,没有办法直接访问foreach
中的索引。有一个拉取请求,可以在此处添加$index
变量:https://github.com/SteveSanderson/knockout/pull/182
我过去使用的一个选项是对observableArray使用手动订阅,以保持索引可观察同步。
它的工作原理如下:
//attach index to items whenever array changes
viewModel.tasks.subscribe(function() {
var tasks = this.tasks();
for (var i = 0, j = tasks.length; i < j; i++) {
var task = tasks[i];
if (!task.index) {
task.index = ko.observable(i);
} else {
task.index(i);
}
}
}, viewModel);
答案 1 :(得分:6)
我这样做,而且效果很好。不是最好看,但保持一切顺序:
使用attr:binding设置字段的name属性,然后使用$parent.CallForwards.indexOf($data)
得到你的索引。
data-bind="value: Name, attr: {name: 'CallForwards[' + $parent.CallForwards.indexOf($data) + '].Name'}"
答案 2 :(得分:4)
我相信使用KO 2.1会更容易:你可以在foreach循环中使用$ index来引用当前索引。
https://github.com/downloads/SteveSanderson/knockout/knockout-2.1.0.js