คุณสามารถโทร ko.applyBindings เพื่อผูกมุมมองบางส่วนได้หรือไม่?

ฉันใช้ KnockoutJS และมีมุมมองหลักและมุมมองโมเดล ฉันต้องการไดอะล็อก (หนึ่งใน jQuery UI) เพื่อป็อปอัพพร้อมกับมุมมองอื่นซึ่งจะแยกโมเดลมุมมองชายด์ที่แยกต่างหาก

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หลายครั้งในองค์ประกอบเดียวกันเนื่องจากคุณจะได้รับตัวจัดการเหตุการณ์หลายตัว

ในขณะที่คำตอบของ Niemeyer เป็นคำตอบที่ถูกต้องมากกว่าสำหรับคำถามคุณสามารถทำสิ่งต่อไปนี้:

<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 attribute กับองค์ประกอบที่ฉันไม่ได้กำหนด:

    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