отсоединить/добавить или показать/скрыть частичные фрагменты

Я обнаружил проблему, связанную с нокаутирующими привязками в HTML-частицах. У меня есть область контейнера на странице. Его содержимое предназначено для динамической замены в соответствии с логикой моего приложения. Для этого я использую технику отсоединения/добавления. Однако я заметил, что обновления не распространяются, когда элемент отсоединен. Мало того, в некоторых случаях привязки вообще теряются, а когда элемент прикрепляется обратно, обновление перестает работать.
Обновление данных важно в моем случае, потому что, хотя элемент может быть невидимым, он все равно может обновляться асинхронно.< br/> Я нашел потоки в stackoverflow, указывающие на ту же проблему. Однако однозначного ответа я не нашел. Были различные обходные пути, которые не выглядели привлекательными (например, использование закрытых методов нокаута). Единственный способ заставить все работать так, как задумано, — показать/скрыть частичные фрагменты вместо отсоединения/добавления.
Является ли такое поведение преднамеренным (я имею в виду дизайн нокаутной библиотеки)? Если это так, я бы не хотел обходить это, вводя различные обходные пути, которые потенциально могут привести к новым проблемам в будущем. Если нет, каков рекомендуемый шаблон использования для добавления/отсоединения в нокауте, чтобы он работал так же, как показ/скрытие (я бы предпочел использовать отсоединение/добавление, потому что основное приложение использует эту политику для всех своих контейнеров).

Вот ссылка jsbin для воспроизведения проблемы. Я также включил пример отображения/скрытия для сравнения: https://jsbin.com/iTIrigAp/3/edit?html,js,output

<h3>Attach/Detach</h3>

<p>issue 1: Detach/Update/Attach/Update</p>
<p>issue 2: Run with JS/Update/Enter new val/Detach/Update/Attach</p>

<div id="attdet">
    <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>


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

        this.c = ko.observable("c");
        this.d = ko.observable("d");     
    }

    var vm = new ViewModel();

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


    var nodes = null;

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

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

    $("#update").click(function () {
        vm.a("att-det");
        vm.b("att-det");
    });