4

私がやろうとしているのは、jQuery のデタッチ メソッドを使用していくつかのノードをデタッチし、ビューモデルを更新し、ノードをアタッチして、値を更新することです。

これは可能ですか？

これが私が撮影しているものの完全なフィドルです。基本的に、左から右に移動し、デタッチ、更新、アタッチをクリックして、テキストボックスに新しい値を入力できるようにしたいと考えています。

アップデート

RPの回答に基づいて、これがユースケースに適合すると仮定すると、それらをdom hiddenにアタッチし、ビューモデルを更新してから、ノードを表示するのが最善の策です。このようなものは私にとってはうまくいきます：

$("#updateAndAttach").click(function () {
    var junk = $("<div />").css("display", "none");
    junk.append(nodes);
    $("#home").append(junk);

    vm.a("AAA");
    vm.b("BBB");

    $(nodes).unwrap();
});

更新を終了

完全なコードは次のとおりです。

JavaScript

$(function () {

    function ViewModel() {
        this.a = ko.observable("a");
        this.b = ko.observable("b");
    }

    var vm = new ViewModel();

    ko.applyBindings(vm, document.getElementById("home"));

    var nodes = null;

    $("#detach").click(function () {
        nodes = $("#home").children().detach();
    });

    $("#attach").click(function () {
        $("#home").append(nodes);
    });

    $("#update").click(function () {
        vm.a("AAA");
        vm.b("BBB");
    });
})();

HTML :

<div id="home">
    <input type="text" data-bind="value: a" />
    <input type="text" data-bind="value: b" />
</div>

<button id="detach">Detach</button>
<button id="update">Update</button>
<button id="attach">Attach</button>
4

3 に答える 3

3

単一のバインディングの評価はdata-bind、計算されたオブザーバブルにラップされ、再評価されて現在のドキュメントの一部ではないことが認識されると、それ自体が破棄されます。

そのため、試みていることを実行できるようにする簡単な回避策はありません。更新が行われている間は要素を非表示にしてから、それらを再表示することができます。

于 2012-05-03T18:16:59.187 に答える
1

あなたが質問してからしばらく経ちましたが、私はdetachを使用して発見し、DOM 内の有効な場所にすぐに追加すると、すべてのバインディングがうまく機能し続けます。次に、アプリケーションの状態が変化したときに、必要な場所にデタッチして追加できます。

JQUI要素、フォームなど、複数のイベントが添付されたセクションに使用して、1つのコピーを実行し続け、移動するページに追加するだけです. 例えば。Edit Profileとしても機能する登録フォーム。

あなたの場合、最初に「visibility:hidden;」に追加します。明らかに切り離された要素用であるある時点でのノードは合理的である可能性があります。

ドン 素晴らしい一日を

于 2014-11-28T10:44:17.427 に答える
1

ここで何が起こるかというと、detach メソッドを呼び出すと、ko は切り離されたノードへのバインディングを失います。これを機能させる最も簡単な方法は、ノードをデタッチおよびアタッチするたびにバインディングを再適用することです。

この jsfiddle を参照してください: http://jsfiddle.net/EZFDt/

編集：その回避策を講じると、パフォーマンスに影響する可能性があることに注意してください。おそらく、問題へのアプローチ方法を再考することができます。ノードを切り離すのではなく、別の非表示の場所に移動できますか? それらを単に隠すことはできますか？

于 2012-05-03T18:19:14.387 に答える