Javascript 敲除找不到要删除的结束注释标记

我在twitter引导界面中列出房间，如下所示：

<div class="row-fluid">
    <!-- ko foreach: rooms -->
        <!-- ko if: $index() % 4 == 3 -->
            </div><div class="row-fluid">
        <!-- /ko -->
    <span data-bind="text: $index() % 4"></span>

        <section class="span4">
            <address data-bind="text: pruebaComputed"></address>
            <address data-bind="text: number"></address>
        </section>
     <!-- /ko -->
</div>

vm.separarEnFilas = ko.computed(function () {

    var rooms = this.rooms(),
        result = [];
    for (var i = 0; i < rooms.length; i += 4) {
        var row = [];
        for (var j = 0; j < 4; ++j) {
            if (rooms[i + j]) {
                row.push(rooms[i + j]);
            }
        }
        result.push(row);
    }
    return result;

},vm);

因此，正如您看到的，我列出了房间，我试图插入一个带有row fluid类的div，以遵循引导方式，将东西按行分解

但是我想我遇到了一个bug，因为knockout不能处理嵌套的无容器操作符。。我说的对吗？我怎样才能解决这个问题

---

谢谢

Knockout可以处理嵌套的无容器控件。下面是更改嵌套内容的步骤，以演示它的工作原理

问题在于，knockout不仅仅是放置字符串，它还解析模板的内容，为html创建javascript模板。您的假关闭导致了此错误，因为它不理解您提供的结构：

未捕获错误：找不到要匹配的结束注释标记：ko foreach:rooms

我不确定我会称之为bug，因为它缺乏对模板中动态结构的敲除支持

这是不合法的：

<!-- ko if: $index() % 4 == 3 -->
      </div><div class="row-fluid">
<!-- /ko -->

---

因为它正在关闭一个尚未启动的标记。

谢谢Tyrsius，您让我注意到我必须更改策略：）所以我在viewmodel中添加了一个computed，以将列表按如下方式拆分：

<div class="row-fluid">
    <!-- ko foreach: rooms -->
        <!-- ko if: $index() % 4 == 3 -->
            </div><div class="row-fluid">
        <!-- /ko -->
    <span data-bind="text: $index() % 4"></span>

        <section class="span4">
            <address data-bind="text: pruebaComputed"></address>
            <address data-bind="text: number"></address>
        </section>
     <!-- /ko -->
</div>

vm.separarEnFilas = ko.computed(function () {

    var rooms = this.rooms(),
        result = [];
    for (var i = 0; i < rooms.length; i += 4) {
        var row = [];
        for (var j = 0; j < 4; ++j) {
            if (rooms[i + j]) {
                row.push(rooms[i + j]);
            }
        }
        result.push(row);
    }
    return result;

},vm);

vm.separarEnFilas=ko.computed（函数（）{
var rooms=this.rooms（），
结果=[]；
对于（变量i=0；i

在我看来，我做到了：

<div class="room-list" data-bind="foreach: separarEnFilas">
    <div class="row-fluid" data-bind="foreach: $data">
        <article class="span3">
            <div>
                <address data-bind="text: number"></address>
            </div>
        </article>
    </div>
</div>

---

这是一个很好的解决方案，做得不错。我要做的一件事是将外部绑定修改为

foreach:{data:separarEnFilas，as:'row'}

，并将内部绑定修改为

foreach:row

。它只是让它更容易阅读。