Чи можете ви зателефонувати ko.applyBindings, щоб прив'язати частковий вигляд?

Я використовую KnockoutJS і маю основний вид і модель перегляду. Я хочу, щоб у діалоговому вікні (інтерфейс jQuery) з'явився інший вигляд, до якого повинна бути пов'язана окрема дочірня модель перегляду.

HTML для вмісту діалогу витягується за допомогою AJAX, тому я хочу мати можливість зателефонувати, ko.applyBindingsколи запит завершиться, і я хочу прив’язати модель дочірнього перегляду лише на частину HTML, завантажену через ajax, у діалоговому вікні div.

Це насправді можливо чи мені потрібно завантажити ВСІ мої перегляди та переглядати моделі, коли сторінка спочатку завантажується, а потім ko.applyBindingsодин раз дзвонить ?

ko.applyBindings приймає другий параметр, який є елементом DOM для використання в якості кореня.

Це дозволить вам зробити щось на кшталт:

<div id="one">
  <input data-bind="value: name" />
</div>

<div id="two">
  <input data-bind="value: name" />
</div>

<script type="text/javascript">
  var viewModelA = {
     name: ko.observable("Bob")
  };

  var viewModelB = {
     name: ko.observable("Ted")
  };

  ko.applyBindings(viewModelA, document.getElementById("one"));
  ko.applyBindings(viewModelB, document.getElementById("two"));
</script>

Отже, ви можете використовувати цю техніку, щоб прив'язати viewModel до динамічного вмісту, який ви завантажуєте у діалогове вікно. Загалом, ви просто хочете бути обережними, щоб не зателефонувати applyBindingsкілька разів на одні й ті ж елементи, оскільки ви отримаєте декілька обробників подій.

Хоча відповідь Німейєр є більш правильною відповіддю на це питання, ви могли б також зробити наступне:

<div>
  <input data-bind="value: VMA.name" />
</div>

<div>
  <input data-bind="value: VMB.name" />
</div>

<script type="text/javascript">
  var viewModels = {
     VMA: {name: ko.observable("Bob")},
     VMB: {name: ko.observable("Ted")}
  };

  ko.applyBindings(viewModels);
</script>

Це означає, що вам не потрібно вказувати елемент DOM, і ви навіть можете прив’язувати кілька моделей до одного елемента, наприклад, такий:

<div>
  <input data-bind="value: VMA.name() + ' and ' + VMB.name()" />
</div>

Мені вдалося прив’язати власну модель до елемента під час виконання. Код тут: http://jsfiddle.net/ZiglioNZ/tzD4T/457/

Цікавий біт полягає в тому, що я застосовую атрибут data-bind до елемента, який я не визначав:

    var handle = slider.slider().find(".ui-slider-handle").first();
    $(handle).attr("data-bind", "tooltip: viewModel.value");
    ko.applyBindings(viewModel.value, $(handle)[0]);

Ви повинні переглянути withприв'язку, а також controlsDescendantBindings http://knockoutjs.com/documentation/custom-bindings-controlling-descendant-bindings.html