剔除"if"绑定不适用于可排序列表中的表达式? [英] Knockout "if" binding doesn't work with expression in a sortable list?

问题描述

使用Knockout和Knockout-sortable插件制作的类似待办事项的可排序列表，我遇到了另一个问题.

I just run into another problem with my To-do-like sortable list made with Knockout and Knockout-sortable plugin.

我需要在当前时间放置的元素下方放置一个红色的定界符，如果在该定界符之前删除了一个元素，则取消排序.

I need to put a red delimiter under the element placed in the current time and cancel the sort if a element is dropped before that delimiter.

我尝试使用可见"绑定，并且它以某种方式起作用，但是可见绑定仅隐藏了DOM元素，并且弄乱了可排序的arrayIndex，并向其中添加了不必要的元素.

I tried with a "visible" binding and it works in some way, but the visibile binding just hide the DOM element and it mess up the sortable arrayIndex, adding unnecessary element to it.

<div class="delimiter" data-bind="visible: time() == $root.limit()"></div>

"if"绑定会更好，因为它仅在必要时才插入DOM元素，但是我与visible一起使用的表达式始终被评估为true，我不知道为什么...

The "if" binding would be better because it insert DOM element only if necessary, but the expression I used with visible is always evaluated to true and I can't figure out why...

<div class="delimiter" data-bind="if: time() == $root.limit()"></div>

这是小提琴: http://jsfiddle.net/ingro/VaqqF/

感谢您的帮助，谢谢！

推荐答案

您只是误解了if-binding:它删除了已应用到的节点的内容，而不是节点本身.如果要删除节点而不在其周围创建包装器(可用于添加绑定)，则还有if绑定的注释版本，称为 containerless控制流语法 :

You've simply misunderstood the if-binding: It removes the content of the node it has been applied to, not the node itself. If you want to remove a node without creating a wrapper around it (that you can use to add the binding), there is also the comment-version of the if-binding, called the containerless control flow syntax:

<!-- ko if: time() == $root.limit() -->
  <div class="delimiter"></div>
<!-- /ko -->

http://jsfiddle.net/VaqqF/11/

参考: http://knockoutjs.com/documentation/if-binding.html

这篇关于剔除"if"绑定不适用于可排序列表中的表达式?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！