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>

Popup html文件：

<div id="container">

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

</div>

如果我更换

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

与

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

然后它工作文件（尽管有一个小的延迟，如预期），但这不像是'正确'的答案。这让我相信applyBindings运行得太快，所以我尝试放置$ .load（）的回调，但我得到了相同的结果。

我错过了一些非常明显的东西吗？

Answer 1

在加载ko.applyBindings()的内容之后，您需要确保{em}被称为，因为Ajax是asynchronous并且不会等待在进行Popup.html调用之前要加载的内容。

最简单的方法是提供回调函数：

applyBindings()

请参阅load()

使用Jquery加载来填充jquery ui对话框时的Knockout绑定

1 个答案: