knockout.js嵌套循環索引

我有一個淘汰賽綁定與foreach和內部foreach循環。我需要的是爲每個偶數行應用替代行css規則，而不管它是子級還是父級行。如果我使用下面的$ index，則最後一個子行和第一個父級可能會應用相同的樣式。knockout.js嵌套循環索引

<tbody data-bind="foreach: items"> 
    <tr data-bind="css: { alt: $index()%2 }"> 
     <td colspan="2"> 
      <a data-bind="attr: { 'href': '@Url.Action("View", "MyController")?itemId=' + Id() }"><span data-bind="text: name"></span></a> 
     </td> 
    </tr> 
     <!-- ko foreach: subItems --> 
     <tr data-bind="css: { alt: ($index()+$parentContext.$index()+1)%2 }, visible: $parent.childrenVisible()"> 
      <td></td> 
      <td> 
       <a data-bind="attr: { 'href': '@Url.Action("View", "MyController")?itemId=' + Id() }"><span data-bind="text: name"></span></a> 
      </td> 
     </tr> 
     <!-- /ko -->     
</tbody>

問題：有沒有在淘汰賽使用計數器，並在雙方父母和孩子圈每次迭代增加它的可能性？否則在這種情況下通常會有什麼技巧？

來源

2015-02-09 Alex M

如果可能的話，處理樣式表本身的樣式問題要好得多，而不是訴諸代碼。這是你可以這樣做的一個例子，至少在CSS3中。通過使用:nth-child，您可以應用交替行樣式：

tr { 
    background-color: #ff0000; 
} 

tr:nth-child(2n+1) { 
    background-color: #00ff00; 
}

來源

2015-02-09 12:47:41

偉大的建議，但不幸的是還需要支持IE8以及。我猜可以使用Selectivizr。好奇有沒有其他方法。 – 2015-02-09 12:52:41

@AlexM剛剛看到您的編輯評論（希望SO會突出顯示他們正在編輯！）是的，Selectivizr可能是適當的。我寧願走這條路線，而不必編寫額外的代碼來處理這樣的瀏覽器。當你不再需要支持它們時，只需刪除腳本 - 至少你的代碼仍然是乾淨的，而不是遺留一些不需要的代碼。 – 2015-02-09 12:59:22

knockout.js嵌套循環索引

回答

相關問題