Question

在我的页面中，我有一个下拉（选择），然后是一个表，这两个表都绑定到视图模型。当我更改下拉列表时，表格会刷新与选择中与该项目相关联的数据。

我希望在填充后对表进行一些UI处理。我尝试订阅下拉选项（它会被触发并调用我的函数），但是在订阅完成后更新表数据。

我想要做的是使用如下的简单函数更新表背景行颜色：

updateRowBgColors = function (tableId) {
    $("#" + tableId + " tr:gt(0):odd").css("background-color", "#f7f7f7");
    $("#" + tableId + " tr:gt(0):even").css("background-color", "#fff");
};

是的，我知道我可以在html中为数据绑定中的交替行设置一个类，但这不会回答我关于为什么这不起作用的问题。

Answer 1

您可以将afterRender绑定与foreach binding：

一起使用

<table>
    <tbody data-bind="foreach: {data: people, afterRender: doYourThing}">
        <tr>
            <td data-bind="text: Name"></td>
            <td data-bind="text: Number"></td>
        </tr>
    </tbody>
</table>

在您的视图模型中：

self.doYourThing = function(insertedDomElementArray, dataItem) {
    $('tr:odd').css("background-color", "#f7f7f7");
    $('tr:even').css("background-color", "#fff");
};

fiddle

KO：如何订阅更新的UI以进行后期处理？

1 个答案: