Knockout.js绑定到复杂的html对象

Question

我有一个bootstrap下拉菜单，其中有徽章。 我认为这并不复杂，但是我不能这样做：

<ul class="dropdown-menu" role="menu" data-bind="foreach: events">
    <li><a href="#" data-bind="text: $data.name"><span class=" badge pull-right" data-bind="text: $data.value">NUMBER FROM MODEL TOO</span></a></li>
</ul>

我的问题是，绑定正在生成有效的li项，但是li的innerHtml只是文本，而不是带有绑定号的文本+ span。

我怎样才能做到这一点？

Answer 1

如果在标签上使用文本绑定，则其全部内容将被$ data.name替换。 要同时显示值和名称，可以执行以下操作：

<ul class="dropdown-menu" role="menu" data-bind="foreach: events">
    <li><a href="#"><span data-bind="text: $data.name"></span><span class=" badge pull-right" data-bind="text: $data.value">NUMBER FROM MODEL TOO</span></a></li>
</ul>

小提琴： http : //jsfiddle.net/JUEth/2/