3

ノックアウトjsに問題があります。しかし、私にはバグのようです。たぶん、いくつかの回避策があります。

ここに並べ替えリストの例があり、機能します。別の例がありますが、そうではありません。それらの唯一の違いは、KO のバージョンです。

どんな助けでも大歓迎です。

更新: 理由はわかりませんが、splice メソッドを呼び出した後、KO によってバインディングが誤った方法で更新されます。だから私が見つけた回避策 - 配列モデルを強制的に再バインドします。

再バインドを強制するために使用するコードは次のとおりです。

        // newArray is ko.observableArray([...])
        var original = newArray();
        newArray([]);
        newArray(original); // KO will rebind this array

再バインドを強制するよりエレガントな方法はありますか?

4

1 に答える 1

4

ここで起こっていることは、Knockout 2.1 がリストに新しいアイテムをスプライスしたときにリストを正しく更新していると思いますが、jQuery UI のソート可能な実装も新しいリストにアイテムを追加しています。

これを回避するために、ソート可能な実装によって追加されるアイテムに「ドラッグされた」クラスを追加し、2 つの配列を更新したら削除しました (これにより、期待どおりに UI が更新されます)。

    $list
      .data('ko-sort-array', array)
      .sortable(config)
      .bind('sortstart', function (event, ui) {                  
        ui.item.data('ko-sort-array', array);
        ui.item.data('ko-sort-index', ui.item.index());
        ui.item.addClass('dragged'); // <-- add class here
      })
      .bind('sortupdate', function (event, ui) {
        var $newList = ui.item.parent();
        if($newList[0] != $list[0]){ return; }

        var oldArray = ui.item.data('ko-sort-array');
        var oldIndex = ui.item.data('ko-sort-index');

        var newArray = $newList.data('ko-sort-array');
        var newIndex = ui.item.index();

        var item = oldArray.splice(oldIndex, 1)[0];
        newArray.splice(newIndex, 0, item);
        $list.find('.dragged').remove(); // <-- remove the item added by jQuery here
      });

ここでこれが機能しているのを見ることができます

于 2012-06-11T11:53:59.257 に答える