动态添加的Knockout数据绑定属性不会触发click事件处理程序

Question

在我的viewmodel的viewAttached事件中,我正在创建一个动态锚元素,如下所示:

 qaItemLink = document.createElement("a");
 $(qaItemLink).attr({ 'class': 'qaTreeItem', 'href': '#', 'data-bind': 'click:$root.showQaItemDetails' });

在UI中检查时,呈现如下:

<a class="qaTreeItem" href="#" data-bind="click:$root.showQaItemDetails">Item 1</a>

我没有看到正在渲染的锚标记有任何问题.可能是什么原因导致函数showQaItemDetails没有被调用？

Answer 1

如果在ko.applyBindings调用之后添加了元素,那么Knockout就没有机会绑定它.如果您使用template绑定(或with,foreach等)来添加动态内容,那么Knockout将为您解决此问题.这通常是最好的方法.

在您的情况下,如果可能,您可以等待ko.applyBindings直到添加内容为止.

您也可以通过调用直接绑定元素ko.applyBindings(viewModel, element).这将绑定元素及其子元素.但是,我不知道你的锚需要绑定什么上下文(root与某些嵌套项).

也可以使用ko.applyBindingsToNode(或在3.0中ko.applyBindingAccessorsToNode传递返回绑定的函数)直接应用绑定,如:

ko.applyBindingsToNode(qaItemLink, { click: viewModel.showQaItemDetails }, optionalContext);