数据绑定元素不呈现子元素

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>