KnockoutJS：使用「HTML」結合，新的元素沒有約束力

我有包含ko.observable表示div的conent，像這樣一個視圖模型：KnockoutJS：使用「HTML」結合，新的元素沒有約束力

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

在一段時間後，我更新使用AJAX調用的內容，和我有下面的結合一個div：

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

的HTML返回「內容」有它自己的數據綁定的，這是問題：這些綁定的都不是被解析。根據Knockout和我讀過的每一個資料來源，這都應該發生。當使用'html'綁定時，KO應該足夠聰明來重新綁定。

這是一個在KO 2.2.0中的錯誤（我堅持正確的第二個版本），還是我誤解了HTML綁定處理程序的工作原理？並且在任何人詢問之前，沒有applyBindings在這種情況下不起作用，因爲容器使用html綁定，applyBindings假定應該處理重新綁定本身（我已經通過降級到KO的代碼證實了這一點）。

來源

2013-07-19 Matt Holmes

UPDATE：

這是我的自定義綁定的最終版本。這現在可以自動工作，不會雙重綁定，並且像'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，這可能是一個巨大的安全漏洞，所以請注意跨站點腳本攻擊。

來源

2013-07-19 22:59:24

一個告誡：這不會自動重新綁定，您仍然需要調用applyBindings。這只是允許的。從我理解的'模板'綁定在這種情況下工作得更好，但它們不適合我的用例...所以這對我很有用。 –

最後一次更新是我的最終版本，它是自動的，不會雙重綁定，並且效果更好。注意我將controlsDescendantBindings設置爲true，所以KO引擎不會雙重綁定，並且當dynhtml綁定的值發生變化時，我們強制重新綁定後代。 –

馬特，這完全震撼了。它爲我節省了大量的工作！ – drudru

KnockoutJS：使用「HTML」結合，新的元素沒有約束力

回答

相關問題