当存在beforeRemove处理程序时替换observableArray数据会导致刷新问题

Question

我有一个通知系统可以在计时器上刷新。假设队列中有4条记录。如果您在刷新时查看队列，则基础通知数组将替换为也包含4条记录的新阵列。这显示正常。

但如果我在beforeRemove上有foreach通知，那么我会简要地看到刷新显示8个项目，然后返回4个项目。无论我如何更新数组（简单替换，removeAll然后替换，设置为空数组并一次添加一个等等），就会发生这种情况。即使我从未尝试从数组中删除元素，也会发生这种情况。

这非常令人沮丧，因为我真的希望能够应用转换，但无法弄清楚如何在没有这个故障的情况下使其工作。

使用代码示例进行更新：

这是标记

<table>
<tbody data-bind="foreach: {data: notifications, beforeRemove: hideNotification}">
<tr>
<td data-bind="text: $root.message($data)"></td>
<td><a href="#" data-bind="click: $root.acknowledge.bind($root, $data)">Got It</a></td>
</tr>
</tbody>
</table>

这是代码（注意它是Typescript，我使用的是knockout-es5所以我可以使用更少的括号）：

class Model
{
    private loginId: number = (the current value; details not relevant)

    notifications: Notification[] = [];

    constructor()
    {
        ko.track(this);
    }


    update()
    {
        var self = this;
        $.get(`/api/notifications/${self.loginId.toString()}`).done((data) =>
        {
            self.notifications.removeAll();
            self.notifications = data;
        });
    }

}

var model = new Model();

$(function ()
{
    ko.applyBindings(model);

    model.update();

    setInterval(model.update.bind(model), 5000);
});

这是update方法。这是每5秒调用一次，只需用当前数据替换notifications数组。正如我上面所说的，如果没有beforeRemove关键字，它就能完美运行。如果那样，并且队列中有4个通知，则显示的表从4行跳到8行然后再回到4，即使数组在添加之前被清除，所以实际上从未实际数组中的8行。

Answer 1

这就是我想你想要的。点击＆＃34;更新＆＃34;按钮以异步更新（无转换）。单击某个项目将其删除（带过渡）。

https://jsfiddle.net/xpq4vm31/3/

相关代码：

update()
{
    var self = this;
    setTimeout(function() {
        self.updating = true;
        self.notifications.removeAll();
        self.notifications(["First", "Second", "Third");        
        self.updating = false;
    });
}

hideNotification(element, index, item)
{
    if (this.updating) {
       $(element).remove();
    } else {
       $(element).fadeOut(2000, function(){$(this).remove();});
    }
}