Knockout Foreach循环渲染太多元素

我正在使用敲除foreach循环来渲染一组div，循环工作但是它呈现每个数组项目之前（这是数组的长度）渲染下一行。Knockout Foreach循环渲染太多元素

<div data-bind="foreach: { data: activitySubList } "> 
    <div class="tblRow ui-helper-clearfix" data-bind="css: { odd: $index() % 2 }, attr: { id: 'actRow' + $index() }"> 
     <div class="rowCell editCell"><a href="#">Edit</a></div> 
    </div> 
</div>

所得的标记看起来像这样：

<div data-bind="foreach: { data: activitySubList, includeDestroyed: false }"> 
    <div class="tblRow ui-helper-clearfix" data-bind="css: { odd: $index() % 2 }, attr: { id: 'actRow' + $index() }" id="actRow0"> 
     <div class="rowCell editCell"><a href="#">Edit</a></div>         
    </div>        
    <div class="tblRow ui-helper-clearfix" data-bind="css: { odd: $index() % 2 }, attr: { id: 'actRow' + $index() }" id="actRow0"> 
     <div class="rowCell editCell"><a href="#">Edit</a></div>         
    </div>        
    <div class="tblRow ui-helper-clearfix" data-bind="css: { odd: $index() % 2 }, attr: { id: 'actRow' + $index() }" id="actRow0"> 
     <div class="rowCell editCell"><a href="#">Edit</a></div>         
    </div>        
    <div class="tblRow ui-helper-clearfix odd" data-bind="css: { odd: $index() % 2 }, attr: { id: 'actRow' + $index() }" id="actRow1"> 
     <div class="rowCell editCell"><a href="#">Edit</a></div>         
    </div>        
    <div class="tblRow ui-helper-clearfix odd" data-bind="css: { odd: $index() % 2 }, attr: { id: 'actRow' + $index() }" id="actRow1"> 
     <div class="rowCell editCell"><a href="#">Edit</a></div>         
    </div>        
    <div class="tblRow ui-helper-clearfix odd" data-bind="css: { odd: $index() % 2 }, attr: { id: 'actRow' + $index() }" id="actRow1"> 
     <div class="rowCell editCell"><a href="#">Edit</a></div>         
    </div>        
    <div class="tblRow ui-helper-clearfix" data-bind="css: { odd: $index() % 2 }, attr: { id: 'actRow' + $index() }" id="actRow2"> 
     <div class="rowCell editCell"><a href="#">Edit</a></div>         
    </div>       
    <div class="tblRow ui-helper-clearfix" data-bind="css: { odd: $index() % 2 }, attr: { id: 'actRow' + $index() }" id="actRow2"> 
     <div class="rowCell editCell"><a href="#">Edit</a></div>         
    </div>        
    <div class="tblRow ui-helper-clearfix" data-bind="css: { odd: $index() % 2 }, attr: { id: 'actRow' + $index() }" id="actRow2"> 
     <div class="rowCell editCell"><a href="#">Edit</a></div>         
    </div> 
</div>

在短环路移动以使下一个元素之前呈现每个元件的array.length（）（在这种情况下3次）。

编辑：activitySubList是一个有3个元素的ko.observableArray。编辑2：我意识到这个问题并没有被真正问到，但问题解决了。它最终没有任何与每个循环有关的事情，但它自己的形式多次绑定创建重复的数据

来源

2017-08-30 Stizz1e

我觉得你真的需要能够在[mcve]中复制这个以获得一个很好的答案或解释。 –

显示“activitySubList”是什么......它是如何构建的，它是如何填充的，它是什么等等。 –

作为activitySubList充满了特定于业务的信息，我无法真正显示它，但正如我在编辑中所述是一个淘汰赛观察数组，填充三个元素，我可以告诉它通过查看它在视觉工作室手表工作，但循环渲染九行时，它应该只渲染三个 – Stizz1e

你没有提供你的数据绑定的草图实现，因为其他人已经评论。假设'activitySubList'是你的var，你试过了吗？

<div data-bind="foreach: activitySubList">

来源

2017-08-30 17:03:43 jonach

或者这样： < - KO的foreach：activitySubList - > 或许应该看看淘汰赛文档 http://knockoutjs.com/documentation/foreach-binding.html – WiseGuy

Knockout Foreach循环渲染太多元素

回答

相关问题