Jak uzyskać dostęp do indeksu elementu w szablonie knockout.js

Question

W ramach szablonu poniżej, jak uzyskać dostęp do indeksu renderowanego elementu?

<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> 

Answer 1

Aktualizacja: $index jest już dostępna w wersji 2.1.

Obecnie nie ma sposobu na bezpośredni dostęp do indeksu w pliku foreach. Jest prośba przyciąganie że patrzy na dodanie zmiennej $index tutaj: https://github.com/SteveSanderson/knockout/pull/182

Opcja, która Użyłem w przeszłości jest użycie ręcznego subskrypcji przeciwko observableArray który utrzymuje indeks zaobserwowania zsynchronizowane.

To działa tak:

//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); 

Oto przykład: http://jsfiddle.net/rniemeyer/CXBFN/

Answer 2

robię to i to działa całkiem dobrze. Nie wygląda najlepiej, ale zachowuje wszystko w porządku:

Użyj wiązania attr :, aby ustawić atrybut nazwy swojego pola, a następnie użyj $parent.CallForwards.indexOf($data) , aby uzyskać indeks.

data-bind="value: Name, attr: {name: 'CallForwards[' + $parent.CallForwards.indexOf($data) + '].Name'}" 

Answer 3

wierzę, że staje się łatwiejsze z KO 2.1: można użyć $ index w pętli foreach w odniesieniu do aktualnego indeksu.

https://github.com/downloads/SteveSanderson/knockout/knockout-2.1.0.js

dokumentacja: http://knockoutjs.com/documentation/binding-context.html