Question

我刚开始使用Knockout而且我不确定我是否发现了该库的错误，或者我是否只是在禁止它。

我有一个数组，我希望在三个列表之间进行分割以便显示，但看起来开始和结束ul标签对我来说很麻烦。

以下是我尝试做的事情，似乎只有第一个列表项为每个列表呈现而其他列表项被跳过。 http://jsfiddle.net/bn44e/2/

这是一个几乎相同的jsfiddle，我用<ul></ul>和start替换stop标签，并且正在呈现所有列表项。 http://jsfiddle.net/Ue4C3/

Answer 1

这不是一个错误，ko虚拟元素绑定的开启和关闭必须与DOM的相同级别。

因为ko管理的是DOM，它需要动态创建/删除虚拟元素中的所有 DOM（非字符串）内容。 ko无法管理单个<ul>（或</ul>）字符串。

所以在第一个jsfiddle中，ko会像这样对待你的绑定：

<!-- ko foreach: items -->

  <!-- ko if: $index() === 0 || $index() === 10 || $index() === 20 -->
    <ul>

    <!-- ignored because there is no matching opening -->
    <!-- /ko --> 

    <li>Index <span data-bind="text: $index()" style="color:blue;"></span></li>

    <!-- ignored because there is no matching closing -->
    <!-- ko if: $index() === 9 || $index() === 19 || $index() === 29 -->

    </ul>
  <!-- /ko --> <!-- this closing actually matches the first opening ko -->

<!-- /ko -->

<强>更新

看起来被忽略的虚拟绑定搞砸了内部的绑定上下文，必须删除不匹配的虚拟绑定以使内部$index正常工作。 http://jsfiddle.net/bn44e/1/

我不知道上下文问题背后的原因，猜测需要挖掘淘汰源代码，找出无与伦比的虚拟绑定的影响。

但无论如何，不匹配的虚拟绑定不应该保留在生产代码中。

Knockout js嵌套控件流绑定不起作用

1 个答案: