knockout.js - 淘汰 observableArray 不更新

Question

我有一个 observableArray 不会在 HTML 中更新，即使我可以将它记录到控制台并看到它的变化。我希望 jsfiddle 有一个控制台，这样我就可以展示那部分。

在我发布的示例中，我有一个人员列表，然后我搜索该列表并尝试将结果添加到新的 observableArray。搜索结果 observableArray 永远不会在 HTML 中更新。

这是我的 Jsfiddle：http: //jsfiddle.net/hMmgV/1/

这是我的代码：

function AppViewModel() {
    var self = this;

    self.people = ko.observableArray([{
        fName: "Thomas",
        lName: "Edison"
    }, {
        fName: "Sally",
        lName: "Salputrio"
    }, {
        fName: "Edward",
        lName: "Sparkleshine"
    }, {
        fName: "Jacob",
        lName: "Wolfsson"
    }]);
    self.searchResult = ko.observableArray([]);
    self.searchFieldKo = ko.observable("");

    self.submitSearch = function () {
        if (self.searchFieldKo() != "") {
            self.searchResult().length = 0;
            $.each(self.people(), function (pKey, pObj) {
                $.each(pObj, function (pProp, pValue) {
                    if (pValue.toString().toLowerCase().indexOf(self.searchFieldKo().toLowerCase()) >= 0) {
                        self.searchResult().push(self.people()[pKey]);
                        console.log(self.searchResult());
                    }
                })
            })
        } else {
            alert("Please type something.");
        }
    }
}

ko.applyBindings(new AppViewModel());

Answer 1

你有一组不必要的括号

self.searchResult().push(self.people()[pKey]); 

它应该是

self.searchResult.push(self.people()[pKey]);

演示JSFiddle。

因为当您编写时，self.searchResult()您正在访问 observable 中的底层数组。并且当您推入该数组时，不会通知 KO 更改，因此您需要在其自身上使用该push方法。observableArray

顺便说一句，Knockout 有一组非常有用的数组助手，可以简化你的过滤逻辑。