javascript - 有条件地渲染容器

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 站点上发现了一个线程，该线程表明这 不可能使用 native 模板 模型: https://github.com/SteveSanderson/knockout/issues/307

显然，结束注释被理解为未关闭的 div 标记的内部。

我寄希望于动态模板，但也如 fiddle 所示失败了。

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，如 knockout 文档中所述。

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