javascript - KnockoutJS : Using 'html' binding, 新元素未绑定(bind)

Question

我有一个 View 模型，其中包含一个表示 div 内容的 ko.observable，如下所示:

function claimContainerViewModel(elem, api) {
    this.content = ko.observable('<somecontent>');
}

稍后，我使用 AJAX 调用更新该内容，并且我有一个具有以下绑定(bind)的 div:

<div id="ClaimContainer" data-bind="html: content">

为“内容”返回的 HTML 有它自己的数据绑定(bind)，这就是问题所在:这些绑定(bind)都没有被解析。根据 Knockout 和我读过的所有消息来源，这应该会发生。使用“html”绑定(bind)时，KO 应该足够聪明，可以重新绑定(bind)。

这是 KO 2.2.0 中的一个错误(我现在一直坚持使用的版本)，还是我误解了 html 绑定(bind)处理程序的工作原理？在任何人问之前，没有 applyBindings 在这种情况下不起作用，因为容器使用 html 绑定(bind)，applyBindings 假定它应该自己处理重新绑定(bind)(我已经通过进入 KO 的代码确认了这一点)。

Answer 1

更新:

这是我的自定义绑定(bind)的最终版本。现在，它会自动工作，不会双重绑定(bind)，并且就像“html”绑定(bind)一样工作，但更加动态。

if (!ko.bindingHandlers['dynhtml']) {
    ko.bindingHandlers['dynhtml'] = {
        'init': function() {
            return { 'controlsDescendantBindings': true };
        },
        'update': function (element, valueAccessor, allBindings, viewModel, bindingContext) {
            ko.utils.setHtml(element, valueAccessor());
            ko.applyBindingsToDescendants(bindingContext, element);
        }
    };
}

请，请，请注意，如果您不知道 HTML 的来源，这可能是不安全的。非常非常不安全。如果未经过滤的用户输入可以进入您的 HTML，这可能是一个巨大的安全漏洞，因此请注意跨站点脚本攻击。