带有$ index绑定的备用行样式

Question

我无法使用foreach绑定上下文将替代行css类应用于挖空模板.我正在使用具有可用$index上下文变量的knockout 2.1 .

这有什么令人困惑的:

我的模板

<li class="row" data-bind="css: { alt: $index%2 }"></li>

但是,结果是没有alt应用任何类:

<li class="row" data-bind="text: $index"></li>

正常工作并显示行号.

Answer 1

我挣扎了几分钟,发现自从新的绑定上下文变量(如$index)在knockout 2.1中引入后,这个问题并未真正被覆盖

我犯的错误是我忘记了它$index本身是一个可观察的,如果我们在data-bind属性中的表达式中使用它,则必须将其解包.即

<li class="row" data-bind="css: { alt: $index%2 }"></li>

应该成为

<li class="row" data-bind="css: { alt: $index()%2 }"></li>

woops :)

Answer 2

不要用Javascript做替代的行样式,使用CSS更方便:)

https://developer.mozilla.org/en-US/docs/CSS/:nth-child