KnockoutJS:使用'html'绑定,新元素不绑定

KnockoutJS: Using 'html' binding, new elements not binding

本文关键字:绑定 元素 新元素 html KnockoutJS 使用      更新时间:2023-09-26

我有一个视图模型,它包含一个表示div锥的ko.observable,如下所示:

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

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

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

为"content"返回的HTML有自己的数据绑定,这就是问题所在:这些绑定都没有被解析。根据Knockout和我读到的每一个消息来源,这是应该发生的。当使用"html"绑定时,KO应该足够聪明,可以进行重新绑定。

这是KO 2.2.0中的一个错误吗(我现在使用的版本),还是我误解了html绑定处理程序的工作方式?在任何人提出要求之前,在这种情况下,没有AppleyBindings是不起作用的,因为容器使用了html绑定,AppleyBindiations认为它应该自己处理重新绑定(我已经通过深入KO的代码来确认这一点)。

更新:

这是我的自定义绑定的最终版本。这现在可以自动工作,不会双重绑定,工作方式与"html"绑定类似,但更具动态性。

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,这可能是一个巨大的安全漏洞,所以要注意跨站点脚本攻击。

相关文章: