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

时间:2013-07-19 22:50:37

标签: javascript knockout.js

我有一个视图模型,其中包含一个表示div的conent的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绑定处理程序的工作原理?在任何人问之前,没有applyBindings在这种情况下不会起作用,因为容器使用了一个html绑定,applyBindings假设应该处理重新绑定本身(我已经通过逐步介绍KO的代码来证实这一点)。 / p>

1 个答案:

答案 0 :(得分:13)

<强>更新

这是我的自定义绑定的最终版本。这现在可以自动运行,不会双重绑定,并且就像“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,这可能是一个巨大的安全漏洞,因此请注意跨站点脚本攻击。