Использование knockout.js, мне нужно "подсчет" внутри моего шаблона

В принципе, я хочу "маркировать" каждую строку, которую создает мой шаблон с номером строки

например.

1 [other html]
2 [other html]
3 [other html]

ранее, добавляя объект к массиву (массив, используемый шаблоном), я бы подсчитал элементы массива, а затем добавил этот счет к новому объекту, который я добавляю в массив...

НО, теперь мне нужно удалить, и он создает что-то вроде этого при удалении:

1 [other html]
3 [other html]

где '2' был удален, но на самом деле я хочу, чтобы он просто маркировал номера строк и не был идентификатором внутри данных в строке. Поэтому "3" должно исчезнуть, а "2" должен быть последним, хотя "2" был тем.

Ответ 1

Начиная с версии нокаута 2.1 используйте переменную $index вместо метода arrayIndexOf (например, этот ответ).

Я бы использовал для этого и $parent для примера, например http://jsfiddle.net/u9GWr/139/

Html:

<ul data-bind="with: vm.items">
    <!-- ko foreach: $data -->
    <li><span data-bind="text: ko.utils.arrayIndexOf($parent, $data)"></span>
        <span data-bind="text: name"></span>
    </li>
    <!-- /ko -->
</ul>

JavaScript

vm = {
    items: ko.observableArray( [
        {name: ko.observable("a")},
        {name: ko.observable("b")},
        {name: ko.observable("c")},
    ])
}

ko.applyBindings(vm);

vm.items.splice(2,0, { name: ko.observable('test')});

Выход

0 a

1 b

2 тест

3 c

Ответ 2

С нокаутом 2.1 (возможно, раньше) вы можете сделать

<span data-bind="text: $index"></span>

вместо

<span data-bind="text: ko.utils.arrayIndexOf($parent, $data)"></span>

Обновлен скрипт - http://jsfiddle.net/u9GWr/140/