從兩個可觀察數組中獲取計算值

Question

我讀了很多線程，並且沒有足夠的信息來計算兩個可觀察數組，並在它們上跟蹤添加/刪除並更新計算出的可觀察數組，因為現在計算僅更新一次，並且從不更改，而對它們進行了很多更改二。

這是JsFiddle

這是其背后的代碼：

var VM = function () {
    var self = this;

    self.first = ko.observableArray([{
        Id: 1,
        name: "john"
    }, {
        Id: 3,
        name: "steve"
    }, {
        Id: 5,
        name: "roger"
    }]);

    self.second = ko.observableArray([{
        Id: 2,
        name: "laker"
    }, {
        Id: 4,
        name: "don"
    }, {
        Id: 6,
        name: "idiot"
    }]);

    self.both = ko.computed(function () {
        return self.first().concat(self.second());
    });

    self.removePerson = function (v) {
        (self.first().indexOf(v) !== -1) ? ko.utils.arrayRemoveItem(self.first(), self.first()[self.first().indexOf(v)]) : ((self.second().indexOf(v) !== -1) ? ko.utils.arrayRemoveItem(self.second(), self.second()[self.second().indexOf(v)]) : console.log("Item doesnt exist"));
    }
}

ko.applyBindings(new VM());

---

題

在first或second更改后，如何進行computed更新？

Answer 1

您的計算很好，您的removePerson工作不正常。

因此，請不要在UI上看到更改，因為當您使用ko.utils.arrayRemoveItem它將從基礎數組中刪除項目，因此KO將不知道更改，因此不會更新計算所得的值。

解決此問題的一種方法是在刪除之后觸發數組上的valueHasMutated() ，這將觸發計算的更改。 （ 演示 ）

或者，您可以使用myObservableArray.remove(someItem)方法（請參閱doc ）代替：

self.removePerson = function (v) {
    (self.first().indexOf(v) !== -1) 
    ?  self.first.remove(v) 
    :  self.second.remove(v)
}

演示JSFiddle。