淘汰赛清单项目动画

Question

我一直在使用Knockout.js已经有一段时间了，但直到最近我才开始整合jqueryUI动画，以提供更好的用户体验。我看到一些问题试图在表标签内的tr元素上使用动画绑定。当我使用“可见”绑定来隐藏和显示每个元素时，它工作得很好但是当我尝试动画显示每个元素的隐藏时，它似乎只适用于表格中的第一行。我尝试过使用各种方法。我尝试使用淘汰赛foreach模板'afterAdd'选项，如下所述：

http://knockoutjs.com/documentation/foreach-binding.html#note_5_postprocessing_or_animating_the_generated_dom_elements

我还创建了一个自定义绑定，并尝试在每个表行项目上使用相同的结果。

最后，我尝试使用此处的插件：

http://www.codecoding.com/knockout-plugin-visibility-bindings-with-jqueryui-effects/

同样，它似乎只适用于表格的第一个元素。现在，在尝试重写我的HTML以使用div和spans而不是表格之前，我想看看是否有其他人在过去看过这些类型的淘汰问题。 HTML的相关部分是这样的：

<table class="tab_table table_a">
    <tbody data-bind="foreach:featuredMenuItems,visible:showFeatured">                                              
        <tr data-bind="fadeVisible:readyToShow, click:function(){$root.showProductOptions($data);}">            
            <td class="td_large" data-bind="css:{td_select:itemInCart};"><span class="inCart_delete" data-bind="css:{display_IB:itemInCart},click:removeFromCart,clickBubble:false"><i class="fa fa-times-circle"></i></span><span data-bind="text:name"></span></td>
            <td class="td_last" data-bind="css:{td_select:itemInCart},text:lineItemCost"></td>
        </tr>
    </tbody>
</table>

我会将ViewModel代码粘贴到此处，但它是一个相当大的视图模型，相关部分只是一个简单的“readyToShow”可观察设置为true或false。每当显示该表时，使用超时将包含表项的observableArray中的每个对象的“readyToShow”值设置为true，以便在显示表时显示级联效果。

我非常感谢你们提供的任何帮助。谢谢！