數據綁定元素不呈現子元素

Question

所以我試圖用敲除來綁定一些顏色和內容。下面是HTML我此刻

<ul class="simple-data" data-bind="foreach: chartLegendInfo"> 
    <li data-bind="text: Key"> 
      <span class="legend-swatch" data-bind="style: { background_color: $parent.Value }"></span> 
    </li> 
</ul> 

發生了什麼事是，<li>元素文本正確渲染，但內在<span>沒有渲染的。沒有錯誤輸出。我假設這與knockout呈現內部html的方式有關，所以span html可能會被綁定到<li>的文本覆蓋。

有誰知道如何解決這個問題或實現這種效果？

Answer 1

綁定到li的數據被設置爲該li的innerHTML，因此跨度被刪除。處理這種情況的最好方法是使用兩個範圍內，如果李：

<ul class="simple-data" data-bind="foreach: chartLegendInfo"> 
<li> 
     <span data-bind="text: Key"></span> 
     <span class="legend-swatch" data-bind="style: { background_color: $parent.Value }"></span> 
</li>