Twitter bootstrap 如果绑定了不匹配的标记,则为Knockoutjs

Twitter bootstrap 如果绑定了不匹配的标记,则为Knockoutjs,twitter-bootstrap,knockout.js,Twitter Bootstrap,Knockout.js,我有一个可观察的数组,比如说{people:ko.observableArray()},我已经绑定到一系列div <!-- ko foreach: people --> <div><span data-bind="text: name"></span></div> <!-- /ko --> 现在我想使用一个网格框架(特别是twitter引导网格,因为它在项目中已经很普遍)并每两个项目开始一行。我试过下面的方法 <

我有一个可观察的数组,比如说
{people:ko.observableArray()}
,我已经绑定到一系列div

<!-- ko foreach: people -->
<div><span data-bind="text: name"></span></div>
<!-- /ko -->

现在我想使用一个网格框架(特别是twitter引导网格,因为它在项目中已经很普遍)并每两个项目开始一行。我试过下面的方法

<div class="row-fluid">
    <!-- ko foreach: people -->
        <div class="span6"><span data-bind="text: name"></span></div>
        <!-- ko if: $index() % 2 === 1 -->
        </div><div class="row-fluid">
        <!-- /ko -->
    <!-- /ko -->
</div>

不幸的是,knockout不喜欢if语句中不匹配的标记,并抛出绑定错误。我可以在我的视图模型中完成这项工作,并将其拆分为一个数组,但这感觉不对,如果我要更改为每行3个,那么我必须同时更改视图和视图模型

我把这作为一个起点


有没有办法让这样的东西单独在视图中工作?当然,如果有一种方法可以让引导网格在不使用标签体操的情况下进行包装,也可以解决这个问题。

您可以使用原始绑定来欺骗KO。这有点像黑客,但很管用


试试这个:

您不需要原始绑定

<div class="container-fluid rb">
        <!-- ko foreach: people -->
        <!-- ko if: $index() % 2 === 0 -->
            <div class="row-fluid gb">
        <!-- /ko -->
        <!-- ko if: $index() % 2 === 1 -->
            </div>
        <!-- /ko -->
        <div class="span6 bb">
            <span data-bind="text: name"></span>
        </div>

        <!-- /ko -->
</div>    


定制绑定可以解决这一问题这听起来正是我想要的,但似乎没有原始绑定。这是一个很容易自己编写的绑定,但我想先检查一下我没有遗漏什么。它是KOI中的内置绑定,但似乎仍然找不到它,它可能在最近的版本中被删除了吗?您提供的小提琴似乎也不起作用。哦,对不起,它被称为“html”,奇怪的是,我想我检查了小提琴的输出是否正确。感谢Anders,问题是虚拟元素中不允许html绑定,这是一个遗憾。
<div class="container-fluid rb">
        <!-- ko foreach: people -->
        <!-- ko if: $index() % 2 === 0 -->
            <div class="row-fluid gb">
        <!-- /ko -->
        <!-- ko if: $index() % 2 === 1 -->
            </div>
        <!-- /ko -->
        <div class="span6 bb">
            <span data-bind="text: name"></span>
        </div>

        <!-- /ko -->
</div>