基于淘汰赛foreach索引绑定类答案

【问题标题】：Bind class based on knockout foreach index基于淘汰赛foreach索引绑定类
【发布时间】：2017-12-12 23:14:47
【问题描述】：

我需要使选项卡组中的第一项处于活动状态。我正在尝试使用 foreach 的索引，并以此为基础设置类。

    <ul class="nav nav-tabs" data-bind="foreach: TemplateGroups">
        <li data-bind="css: {active: $index==0}"><a data-toggle="tab" href="#tb1"><span data-bind="text: Description"></span></a></li>
    </ul>

但是，该项目未激活。我错过了什么？

【问题讨论】：

$index 是一个 observable 并且会在项目的索引发生变化时更新 (knockoutjs.com/documentation/binding-context.html)。一个 observable 是一个函数。然后，您将函数与数字进行比较，并且始终为假。你应该使用active: $index() == 0。示例：codepen.io/anon/pen/NgOgNd.
谢谢。工作。你能回答一下，我会标记并关闭。谢谢。菜鸟错误。

标签： html twitter-bootstrap knockout.js

【解决方案1】：

来自Binding context

$index 是一个 observable，并且会在项目的索引发生变化时更新

而 observable 是一个函数。

然后，您将函数与数字进行比较，并且始终为假。

您应该使用主动：$index() == 0 或 $index() === 0。

示例：Codepen

【讨论】：