Вопрос по javascript – Использование KnockoutJS с отсоединенными узлами

4

То, что я хочу сделать, это отсоединить некоторые узлы с помощью метода отсоединения jQuery, обновить мою ViewModel, присоединить мои узлы обратно и получить значения, которые будут обновлены.

Это возможно?

Вот этополная скрипка из-за чего я снимаю. По сути, я хотел бы иметь возможность перемещаться слева направо, нажимать кнопку отсоединения, обновлять и прикреплять и иметь новые значения в текстовых полях.

UPDATE

Основываясь на ответе RP, лучше всего предположить, что это соответствует вашему варианту использования, - прикрепить их к домену.hiddenобновите вашу viewmodel, а затем покажите ваши узлы. Как-то так у меня работает

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

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

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

END UPDATE

Вот полный код:

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>

Ваш Ответ

3   ответа
1

что когда вы вызываете метод detach, ko теряет привязки к отдельным узлам. Самый простой способ заставить это работать - повторно применять привязки каждый раз, когда вы отсоединяете и присоединяете узлы.

Смотрите это jsfiddle:http://jsfiddle.net/EZFDt/

Изменить: Имея этот обходной путь, имейте в виду, что это может повлиять на производительность. Возможно, вы можете переосмыслить подход к проблеме - можете ли вы переместить узлы в другое, скрытое место вместо их отсоединения? Вы можете просто спрятать их?

Спасибо за ответ, но я думаю, что есть проблемы с повторным применением привязок несколько раз.stackoverflow.com/a/8284095/352552 Adam Rackis
Правильно. Однако метод applyBindings принимает параметр узла, который применяет привязки только к этому узлу.
Правда! Если вы вставляете новые dom-узлы, это может пригодиться. Я просто хотел обновить свою виртуальную машину, пока узлы отключены. +1 Adam Rackis
Вы должны быть очень осторожны при повторном применении привязок к существующим элементам. В этом случае единственная причина удаления привязок заключается в том, что наблюдаемые, от которых они зависят, обновляются. В зависимости от варианта использования, это может или не может быть правдой. Всегда лучше избегать применения привязок несколько раз, чтобы избежать дополнительных обработчиков. Вот пример, который показывает, что обработчики событий все еще будут задерживаться в этом сценарии:jsfiddle.net/rniemeyer/LS72r/1, После отсоединения, обновления, повторного присоединения и повторного применения нажатия кнопки будут обрабатываться дважды.
1

как вы задали вопрос, но я нашел использованиеdetachтогда сразуappend в какое-то действительное место в DOM, все привязки работают хорошо. Вы можете тогдаdetach, append куда вам нужно, поскольку ваше приложение меняет состояние.

Я использую его для разделов с несколькими прикрепленными событиями, таких как элементы JQUI, формы и т. Д., Чтобы я мог бегать вокруг одной копии и просто добавлять кpage Я иду в. например.Signup форма, которая также функционирует какEdit Profile.

В вашем случае сначала добавьте его в «видимость: скрытый»; узел в какой-то момент, который был явно для отдельных элементов, может быть разумным.

дон Хорошего дня

3

data-bind обернуты в вычисляемую наблюдаемую область, которая утилизирует себя при повторной оценке и распознает, что она не является частью текущего документа.

Таким образом, не существует простого обходного пути, который позволил бы вам делать то, что вы пытаетесь. Вы, конечно, можете скрыть элементы во время обновления и затем показать их.

Благодарю. Для меня обходной путь прост - мне нужно обновить только перед повторным присоединением, так что мое редактирование выше делает это довольно просто и красиво. Adam Rackis

Похожие вопросы