我有一个可观察的项目数组，这些项目可以使用 Knockout 可排序插件进行拖放。我可以按照 doc 在元素上应用自定义模板绑定(bind)使用下面的代码。
<div style="border-width:0;" data-bind="sortable: {template: 'customTemplate', data: observableArray}">
我的要求是根据应用于项目属性的特定条件为数组中的不同项目使用不同的模板。例如，如果我们对可观察数组中的每个项目都有一个名为“status”的属性，那么如果 status 为 true，则我想绑定(bind)“template1”，否则绑定(bind)“template2”。
我能够对可以使用 ko 中的 foreach 循环遍历的数组实现相同的效果，但无法对可排序数组执行相同的操作，因为它不允许使用 foreach。有人可以提出相同的解决方案/解决方法吗？
更新:我能够根据条件在同一模板中应用自定义绑定(bind)，但这会导致一个奇怪的错误，即在将元素拖放到目标容器中时将元素克隆到父容器中。演示可以在这里看到:jsFiddle
我根据姓名对学生应用了不同的样式，但是将学生放到表中后，它也会被克隆到父表中。可能的问题是什么？
注意:我不想将条件 css 绑定(bind)到我的元素，我想根据条件区分元素渲染的方式。示例 - 以餐 table 座位为例，如果我有学生对象的姓名、年龄和类(class)属性，我只想显示少数学生的姓名，而某些学生的所有 3 个属性如示例 fiddle 中所示。
最佳答案
我们可以使用条件 css 绑定(bind)来解决该问题
查看:
<script type="text/html" id="customTmpl">
<div data-bind="css:{'one': name() === 'Bobby' ? true : false ,'two': name() != 'Bobby' ? true : false } ">
<p data-bind="text: name"></p>
</div>
</script>
我们可以简单地避免它并使用条件 css 绑定(bind)来实现，而不是采用条件无容器 if 。
工作 fiddle 手 here
有关 css 的文档可用 here
关于jquery-ui - 根据条件绑定(bind)可排序元素的自定义模板(Knockout.js 可排序)，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/30521932/