有条件地渲染容器

Question

是否可以根据条件为模板渲染容器knockout.js？

这不起作用,但显示了我想要做的事情:

<div data-bind="foreach: items">
 <!-- ko if: $data.startContainer -->
 <div class="container">
 <!-- ko -->

 <div data-bind="html: $data.contentElement"></div>

 <!-- ko if: $data.endContainer -->
 </div>
 <!-- ko -->
</div>

Answer 1

在 knockout.js github 站点上找到一个线程，表明使用本机模板模型不可能实现这一点： https: //github.com/SteveSanderson/knockout/issues/307

显然，结束评论被理解为未结束的 div 标签的内部。

我的希望寄托在动态模板上，但也失败了，如小提琴所示。

http://jsfiddle.net/XbdGs/3/

<script type="text/html" id="withContainer">
     <div class="container">
         <!-- ko template: 'withoutContainer' -->
         <!-- /ko -->
     </div>
</script>

由此我得出结论，您可以尝试 3 foreachs 解决方案，使用 Posthuma 建议或回退到另一个模板引擎，如 jquery.tmpl 或 Underscore，如淘汰赛文档中提到的。

http://knockoutjs.com/documentation/template-binding.html