首页 文章

在knockoutjs评论foreach绑定vs foreach绑定

提问于
浏览 次
48

在我的HTML中，我可以定义这些淘汰的foreach绑定：

<!-- ko foreach: customer -->
   <div data-bind="text: id" />
<!-- /ko -->

VS

<div data-bind="foreach: customer">
    <div data-bind="text: id" />
</div>

这两种方法之间的差异在哪里？

javascript knockout.js templating knockout-templating

2 回答

  • 60

    当绑定部分中存在父子关系时，使用本机绑定，如ul和li .

    当绑定部分没有父子关系时，请使用注释语法进行无容器绑定 .

    在您的示例中，您使用第一个代码块，因为您没有尝试绑定到父子结构 . 您要做的只是将客户数据绑定到div，您不必通过客户创建父div和 foreach 并在父div中添加另一个div . 这比你想做的还要多 .

    Good use of containerless binding

    <!-- ko foreach: customer -->
<section>
   <p data-bind="text: customer.name"></p>
   <p data-bind="text: customer.orderDate"></p>
</section>
<!-- /ko -->

    但是，如果你有 ordered list ，你应该使用 native binding 因为它才有意义 .

    Native

    <ol data-bind="foreach: customer">
   <li data-bind="text: customer.name"></li>
</ol>

    Containerless

    <ol> 
   <!-- ko foreach: customer -->
       <li data-bind="text: customer.name"></li>
   <!-- /ko -->
</ol>

    第二个例子看起来很傻 . 你为不应该复杂的东西增加了更多的复杂性 .

    回复于
  • 2

    在某些情况下，您可能希望复制标记的一部分，但是您没有任何容器元素可以放置foreach绑定

    要处理此问题，您可以使用基于注释标记的无容器控制流语法

    模式详情The "foreach" binding, Note 4: Using foreach without a container element

    回复于

相关问题