6

私のビューモデルには、knockoutjsObserableArrayがあります。ViewModelを初期化した直後、データは正常にバインドされます。次に、コレクションを並べ替える必要があります。

$.each(vm.searchResults(), function (i, property) {
    console.log(property.Name());
});

vm.searchResults().sort(function (a, b) {
    return a.Name().toLowerCase() > b.Name().toLowerCase() ? 1 : -1;
});

$.each(vm.searchResults(), function (i, property) {
    console.log(property.Name());
});

ご覧のとおり、要素の名前をコンソールに出力して、並べ替えの前後の順序を確認します。並べ替えは問題なく機能します。問題はUIの更新にあります。どういうわけか、UIは更新されていません。

次に、次のコードを使用して配列からレコードを削除し、UIがそれに応答するかどうかを確認します。

vm.searchResults().shift();

UIは同じままで、再度更新されませんでした。ここでの問題は何でしょうか？

編集：

サンプルケースもあります：http：//jsfiddle.net/tugberk/KLpwP/

ここでも同じ問題。

編集：

このサンプルに示されているように問題を解決しました：http：//jsfiddle.net/tugberk/KLpwP/16/しかし、最初に試したときになぜそれが機能したのかはまだわかりません。

4

1 に答える 1

18

ソートするときに、監視可能な配列をアンラップします。KOがアレイを追跡できないため、これが問題の原因になります。ko.observableArray()同じ署名の機能がsortあり、変更されたことをobservableのサブスクライバーに通知します。解決策は非常に簡単です。中かっこを削除しますvm.searchResults().sort=> vm.searchResults.sort。私の例をチェックしてください：http：//jsfiddle.net/RbX86/

配列に変更があることをKOに伝える別の方法-valueHasMutated配列で操作した後にメソッドを呼び出します。次のサンプルを確認してください。http：//jsfiddle.net/RbX86/1/ このアプローチは、アレイに多くの変更を加える必要があり、UIを1回だけ更新する場合に非常に適しています。

于 2012-05-07T10:28:42.623 に答える