Können Sie ko.applyBindings aufrufen, um eine Teilansicht zu binden?

Ich verwende KnockoutJS und habe eine Hauptansicht und ein Ansichtsmodell. Ich möchte, dass ein Dialogfeld (das jQuery-UI) mit einer anderen Ansicht angezeigt wird, an die ein separates untergeordnetes Ansichtsmodell gebunden werden soll.

Der HTML-Code für den Dialoginhalt wird mit AJAX abgerufen, sodass ich nach Abschluss ko.applyBindingsder Anforderung aufrufen und das untergeordnete Ansichtsmodell nur an den Teil des HTML-Codes binden möchte, der über Ajax im Dialogfeld div geladen wurde.

Ist dies tatsächlich möglich oder muss ich ALLE meine Ansichten und Ansichtsmodelle laden, wenn die Seite zum ersten Mal geladen und dann ko.applyBindingseinmal aufgerufen wird?

ko.applyBindings Akzeptiert einen zweiten Parameter, der ein DOM-Element ist, das als Root verwendet werden soll.

So können Sie Folgendes tun:

<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>

Mit dieser Technik können Sie also ein viewModel an den dynamischen Inhalt binden, den Sie in Ihren Dialog laden. Insgesamt sollten Sie nur darauf achten, dass Sie nicht applyBindingsmehrmals dieselben Elemente aufrufen , da mehrere Ereignishandler angehängt werden.

Während Niemeyer Antwort eine richtige Antwort auf die Frage ist, Sie könnten auch Folgendes tun:

<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>

Dies bedeutet, dass Sie das DOM-Element nicht angeben müssen und sogar mehrere Modelle wie folgt an dasselbe Element binden können:

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

Ich habe es geschafft, ein benutzerdefiniertes Modell zur Laufzeit an ein Element zu binden. Der Code ist hier: http://jsfiddle.net/ZiglioNZ/tzD4T/457/

Das Interessante ist, dass ich das Datenbindungsattribut auf ein Element anwende, das ich nicht definiert habe:

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

Sie sollten sich die withBindung sowie http://knockoutjs.com/documentation/custom-bindings-controlling-descendant-bindings.html ansehencontrolsDescendantBindings