使用knockout.js，我需要在我的模板中的'計數'

基本上，我想'我的模板產生與'行號'每行'標籤使用knockout.js，我需要在我的模板中的'計數'

例如。

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

之前，添加對象的數組（陣列通過模板使用）的時候，我會算數組項，然後添加計數新對象我添加到陣列...

，但現在我需要刪除，它的生產上刪除這樣的事情：

1 [other html] 
3 [other html]

其中「2」已被刪除，但我真的希望它只是標籤的行號，而不是成爲一個id在行內的數據內。所以'3'應該消失，'2'應該是最後一項，儘管'2'是最後一項。

來源

2012-03-22 Nnoel

這是從以前的一個SO問題，一個偉大的答案... http://stackoverflow.com/questions/8744374/how-to-access一個項目在淘汰賽，js模板 – 2012-03-22 17:27:29

從knockout版本2.1開始，使用$ index變量而不是arrayIndexOf方法（例如參見this answer）。

我會使用和$父爲此，例如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')});

輸出

1b中

2測試

3c中

來源

2012-03-23 00:45:50 Artem

偉大的獨立示例代碼，SO需要更多的這個！ – jkraybill 2012-03-23 00:48:55

+1！正是我在尋找的，很好的例子！我把它粘貼到你的答案，以防萬一小提琴進入脫機 – 2012-04-02 18:24:55

@Allen謝謝，我離開所有代碼在飼料有時，現在審查答案faq =） – Artem 2012-04-02 18:44:31

作爲敲除2.1（也許之前）可以做

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

代替

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

更新小提琴 - http://jsfiddle.net/u9GWr/140/

來源

2012-05-22 19:17:23

如何可以索引從1而不是0開始？ – 2016-11-22 05:02:54

'（$ index（）+1）'http://jsfiddle.net/u9GWr/172/ – 2016-11-22 17:24:52

使用knockout.js，我需要在我的模板中的'計數'

回答

相關問題