敲除數據綁定嵌套html元素

Question

我有數據綁定文本屬性H2標籤到模型值和內部我有一個範圍標記這也是一個數據綁定文本屬性的模型值。

但跨度越來越當模型綁定更換，是有什麼辦法可以追加HTML。

http://jsfiddle.net/WKnWr/1/

Answer 1

通常情況下，你想改變你的HTML正確在此方案中工作。但是，如果這是不可能的，那麼你可以使用插入跨度爲你自定義綁定。

這將是這樣的：

ko.bindingHandlers.insertText = { 
    init: function(element, valueAccessor) { 
     var span = document.createElement("span"), 
      firstChild = element.firstChild; 

     element.insertBefore(span, firstChild); 
     ko.applyBindingsToNode(span, { text: valueAccessor() });  
    }  
}; 

樣品：http://jsfiddle.net/rniemeyer/fLmXu/

Answer 2

您當前代碼將覆蓋，因爲「文」結合套的innerText（或的textContent）爲元素，讓你的文字H2結合將覆蓋任何現有的嵌入式HTML（如您的跨度）。

你可以這樣做：

<h2> 
    <span data-bind="text:firstName"></span> 
    <span data-bind="text:lastName "></span> 
</h2>​ 

Answer 3

有了你可以使用一個虛擬元素爲H2的文字，類似於約翰Earles解決方案最新的淘汰賽，但它意味着你可以風格姓氏分別以名字

<h2> 
    <!-- ko text: firstName --><!-- /ko --> 
    <span data-bind="text: lastName"></span> 
</h2>