[解決済み】ko.applyBindingsを呼び出して部分ビューをバインドすることはできますか？

質問

KnockoutJSを使用しており、メインビューとビューモデルを持っています。私はダイアログ（jQuery UIのもの）を、別の子ビューモデルがバインドされている別のビューでポップアップするようにしたいのです。

ダイアログの内容のHTMLはAJAXを使って取得されるので、そのために ko.applyBindings そして、ダイアログ div 内の ajax を介して読み込まれた HTML の部分だけに子ビューモデルをバインドしたいのです。

これは実際に可能なのか、それともページが最初にロードされたときにすべてのビューとビューモデルをロードし、それから ko.applyBindings 一度だけですか？

解決方法は？

ko.applyBindings は、ルートとして使用する DOM 要素を第 2 パラメータとして受け取ります。

これによって、次のようなことができるようになる。

<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 同じ要素に何度もアクセスすると、複数のイベントハンドラが付加されるからです。