Question

我的页面上有一个引导下拉列表，它是动态填充的，没有敲除数据。标准的bootstrap下拉列表是这样的：

<div class="dropdown">
     <button class="btn btn-default dropdown-toggle" type="button" data-toggle="dropdown"> 
         Dropdown <span class="caret"></span>
     </button>
     <ul class="dropdown-menu">

     </ul>
</div>

请注意，下拉列表的“标题”将为“下拉列表”，带有“克拉”类的跨度将添加向下的克拉图标，使其看起来像下拉菜单。

问题是当我添加数据绑定以更改选择菜单标题的文本时（为简单起见省略了一些类）：

<div>
     <button data-bind = "text: MenuTitle"> 
         Dropdown <span class="caret"></span>
     </button>
     <ul >

     </ul>
</div>

MenuTitle只是一个带文本的简单ko.observable。

它覆盖了克拉的跨度。如何对按钮的文本进行数据绑定，并仍在其中附加span类克拉？

Answer 1

将绑定移动到仅为该文本创建的新范围：

<button class="btn btn-default dropdown-toggle" type="button" data-toggle="dropdown"> 
    <span data-bind="text: MenuTitle"></span><span class="caret"></span>
</button>

在Knockout数据绑定文本中包含span元素

1 个答案: