jqueryの読み込みを使用してjquery UIのダイアログを入力するときのノックアウトバインド

Question

私は根本的にここで何かを誤解していると思いますが、私の人生のためにはできないと確信しています。

jquery UIダイアログを使用してフォームポップアップを作成しています。フォームのビューは別ファイルになっていますので、ダイアログを開く際にJquery.load（）を使用してダイアログを作成しています。

ノックアウトバインディングを適用したいと考えています。

いくつかの簡単なコードで問題を再現しました。

メインのHTMLファイル：

<script src="knockout-3.4.0.js"></script> 
<script src="Jquery/jquery-1.12.2.js"></script> 
<script src="jquery-ui-1.11.4/jquery-ui.js"></script> 

<link rel="stylesheet" type="text/css" href="jquery-ui-1.11.4/jquery-ui.css""> 

<script> 
$(document).ready(function(){ 

//initialise the dialog 
$("#dialog").dialog({ 
    modal: true, 
    autoOpen: false 
}); 


$("#btn").click(function(){ 
    //open the dialog and load the html from the Popup page 
    $("#dialog").load('Popup.html').dialog("open"); 



    //apply a simple binding to the container div in the Popup page 
    ko.applyBindings({someText: "value from knockout"}, $("#container")[0]); 


}); 

}); 
</script> 

<button id="btn">Click</button> 

<div id="dialog" style = "display: none;">the hidden Div</div> 

ポップアップhtmlファイル：

<div id="container"> 

<p data-bind="text: someText">Default text in html popup</p> 

</div> 

私は

setTimeout(function(){ 
ko.applyBindings({someText: "value from knockout"}, $("#container")[0]); 
},200); 

と

ko.applyBindings({someText: "value from knockout"}, $("#container")[0]); 

を交換した場合3210

それからファイルは動作しますが（期待通りに少し遅れていますが）、「正しい」答えのようには感じられません。これにより、applyBindingsがあまりにも速く実行されているので、$ .load（）のコールバックを配置しようとしましたが、同じ結果が得られました。

本当に明白なものがありませんか？

Answer 1

あなたはko.applyBindings()が（Ajaxはasynchronousで、内容はapplyBindings()コールに進む前にロードされるのを待つないので）Popup.htmlの後の内容がロードされていると呼ばれていることを確認する必要があります。

それを行うための最も簡単な方法は、コールバック関数を提供することです：

$("#dialog").load('Popup.html', function() { 
    $(this).dialog("open"); 
    ko.applyBindings({someText: "value from knockout"}, $("#container")[0]); 
}) 

は、私はそれが簡単だった信じることができないload()