Question

不确定这是否可行，但现在就可以了。

我有一个带有两个主要文件的应用程序 - 一个javascript文件和一个HTML文件，我使用的是knockout.js，bootstrap和jquery。

在js文件的函数中，我生成一个html表单。我不能将html文件中的表单视为不可见 - 它必须在js文件中生成。

问题是，我在窗体上渲染按钮，这些按钮调用js文件中的敲除函数，但它们只是不起作用。我可以使用javascipt引用这些按钮，但这并不起作用，因为我需要将淘汰模型传递给表单。

代码如下：

在js文件中：

    self.helloFunction = function () {
         alert("Hello World");
}

在html文件中（按预期工作）：

<div>
<input type="image" src="/Images/Buttons/edit.png" data-bind="click: $root.helloFunction" class="input-sm">
</div>

在JS文件中（不会将回调调用回helloFunction）：

var helloWorld = '<div>' +
'<input type="image" src="/Images/Buttons/edit.png" data-bind="click: '$root.helloFunction" title="Hi" class="input-sm">' +
'</div>';

//display the html on the page:
displayForm(helloWorld);

显示效果很好，标题和图像显示，应用了引导程序格式化......它只是没有响应的淘汰赛（对于helloWorld）。

是否可以返回并调用我的淘汰赛功能？

Answer 1

如果在调用applyBindings后使用Knockout将内容添加到页面而不是，则Knockout无法知道它必须处理这些元素。要做到这一点，你需要告诉Knockout使用applyBindings（但要小心避免在同一个元素上调用它两次）或未记录的applyBindingsToNode或{{}来对这些新元素应用绑定。 1}}。

示例：

applyBindingsToDescendants

var vm = {
  msg1: ko.observable("Hi there"),
  msg2: ko.observable("This was bound later; click me!"),
  clicker: function() {
    alert("clicker was clicked!");
  }
};
ko.applyBindings(vm, document.body);
setTimeout(function() {
  var newContent = $('<input type="button" data-bind="value: msg2, click: clicker">');
  newContent.appendTo("#container");
  ko.applyBindings(vm, newContent[0]);
}, 500);

Javascript生成的HTML代码调用knockout

1 个答案: