2

コンソールにログを記録して変更を確認できますが、HTML で更新されない observableArray があります。その部分を表示できるように、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());
4

1 に答える 1

10

に不要な括弧があります

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

そのはず

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

JSFiddle のデモ。

書くself.searchResult()ときは、オブザーバブルの下にある配列にアクセスしているためです。pushそして、その配列にプッシュすると、変更について KO に通知されないため、それ自体でメソッドを使用する必要がありobservableArrayます。

ところで、Knockout には、フィルタリング ロジックを簡素化できる便利な配列ヘルパーが多数用意されています。

于 2013-04-17T19:17:37.887 に答える