Knockout.js 确定使用Knockoutjs ObservableArray添加或删除的元素

我需要弄清楚是哪一个元素从我的击倒耳环上移除的。请看我的

我可以订阅更改，但它只返回值，即添加或删除后的当前数组

self.selectedDataPointOptions.subscribe(function(value) {
  // how can I see which one was added or removed?
  alert(value);
});

---

Knockout包括

ko.utils.comparararrays

，您可以使用它来比较一个数组与另一个数组。以下是一个助手函数，用于通知数组中每个添加或删除的项：

ko.observableArray.fn.subscribeArrayChanged = function(addCallback, deleteCallback) {
    var previousValue = undefined;
    this.subscribe(function(_previousValue) {
        previousValue = _previousValue.slice(0);
    }, undefined, 'beforeChange');
    this.subscribe(function(latestValue) {
        var editScript = ko.utils.compareArrays(previousValue, latestValue);
        for (var i = 0, j = editScript.length; i < j; i++) {
            switch (editScript[i].status) {
                case "retained":
                    break;
                case "deleted":
                    if (deleteCallback)
                        deleteCallback(editScript[i].value);
                    break;
                case "added":
                    if (addCallback)
                        addCallback(editScript[i].value);
                    break;
            }
        }
        previousValue = undefined;
    });
};

ko.observeArray.fn.subscriberRayChanged=函数（addCallback，deleteCallback）{
var previousValue=未定义；
this.subscribe（函数（\u previousValue）{
previousValue=_previousValue.slice（0）；
}，未定义“变更前”）；
this.subscribe（函数（最新值）{
var editScript=ko.utils.compararrays（previousValue，latestValue）；
for（var i=0，j=editScript.length；i

这就是它的作用：

---

从Knockout 3.0开始，您可以使用

arrayChange

事件更轻松地执行此操作。更多信息如下：

建议的解决方案很酷，也很有效，但它涉及到每次发生更改时克隆阵列，然后进行比较，这可能是O（n^2）

这里是另一个解决方案：它意味着包含另一个js文件。。。但如果您想要更好的性能，这将提供：

ObservalArray的替代品（它基本上只是ObservalArray的一个克隆，带有一些额外的代码）使用了淘汰订阅框架，并添加了“添加”和“删除”订阅

示例用法：

var presidents = ko.betterObservableArray();
presidents.subscribe(presidentAdded, this, "add");
presidents.subscribe(this.presidentRemoved, this, "remove");

…

迈克尔·贝斯特的解决方案（已更改）对我也很有效。但是我需要从typescript中使用它，因此我编写了一个小的define source（d.ts），它的源代码与最初的“knockout.d.ts”不同，以便在typescript源代码中以一种舒适的方式使用它

自定义knockoutext.d.ts文件：

/// <reference path="knockout.d.ts" />
interface KnockoutObservableArray<T> extends KnockoutObservableArrayFunctions<T> {
    subscribeArrayChanged(addCallback: (T) => void , deleteCallback: (T) => void );
}

/// <reference path="knockout.d.ts" />
interface KnockoutObservableArray<T> extends KnockoutObservableArrayFunctions<T> {
    subscribeArrayChanged(addCallback: (T) => void , deleteCallback: (T) => void );
}

data[0].Properties.subscribeArrayChanged(
    (value: Meta.Data.Property) => {
        console.log('add callback called');
    },
    (value: Meta.Data.Property) => {
        console.log('delete callback called');
    }
);