敲除绑定迭代

Question

我有一个场景，我需要根据 Observable 标志迭代 ABC 和 XYZ

当前代码

<div  data-bind="visible: isEnabled">
           <ul data-bind="foreach: relatedObservalableArray">
               <li>
               <!-- Hundred lines of code>
               </li>
            </ul>
</div>


<div data-bind="visible: !isEnabled">
        <ul data-bind="foreach: unRelatedObservalableArray">
               <li>
                <!-- Same Hundred lines of code>
               </li>
            </ul>
   </div>

我觉得代码重复。

有什么方法可以将两个 html 函数组合成一个？

由于其他原因，我只想更改 HTML 部分 ...

我是 Knockout 的新手。有人可以帮助我吗？

Answer 1

当然可以为此使用敲除 template 绑定。多读 here.

所以对于更改，它会像下面这样，但您可以根据您从我提供的 link 中读到的内容进行更改。

<script type="text/html" id="template-name">
   Hundred lines of code...
</script>

<div  data-bind="visible: isEnabled">
  <ul data-bind="foreach: relatedObservalableArray">
    <li data-bind="template: 'template-name'">
    </li>
  </ul>
</div>


<div data-bind="visible: !isEnabled">
  <ul data-bind="foreach: unRelatedObservalableArray">
     <li data-bind="template: 'template-name'">
     </li>
  </ul>
</div>

敲除绑定迭代

Knockout binding iteration

knockout.js

knockout-3.0

knockout-binding-handlers