Knockout.js purify html

Question

我有一个表，其中行是使用模板呈现的。应用模板取决于底层行视图模型状态，该模型状态可以是“编辑”或“视图”。因此，我需要使用“编辑-模板”或“视图模板”模板在每个特定的情况。

我希望视图模型不知道它的表示，所以我不使用myViewModel.getTemplateName()函数。另外，将来可能会有两个以上的模板。

因此，我决定在html代码中控制模板，如下所示：

<table>
    <thead>..</thead>
    <tbody>
        <!-- ko foreach: dicts -->
        <!-- ko template: { name: function(){ return (state() == "view")? 'row-etpd-view-template' : 'row-etpd-edit-template' } } -->
        <!-- /ko -->
        <!-- /ko -->
    </tbody>
</table>

显然，它呈现为：

<!-- ko template: { name: function(){ return (state() == "view")? 'row-etpd-view-template' : 'row-etpd-edit-template' } } -->
<tr>...</tr>

对于，每一行。我想避免这么多额外的行，以及在其他情况下的内联KO使用。有办法吗？我想KO在视图模型和DOM元素之间有内存绑定，所以在呈现后它可能不需要这些注释.有主意吗？

谢谢!

Answer 1

处理此问题的一个好方法是使用foreach选项template。

<tbody>
    <!-- ko template: { foreach: dicts, name: function(item) { return (item.state() == "view")? 'row-etpd-view-template' : 'row-etpd-edit-template' } } -->
    <!-- /ko -->
</tbody>