引導chechbox和淘汰賽：自定義綁定模板

Question

在Twitter的引導與標籤複選框不工作時使用的標記，如：

<label class="checkbox"> 
    <input type="checkbox" value="option1"> 
    Option 1 
</label> 

淘汰賽標準「文本」的標籤綁定不工作：複選框標記簡單取代文字。在命名模板

ko.bindingHandlers['checkboxLabelText'] = { 
    'update': function (element, valueAccessor) { 
     var value = ko.utils.unwrapObservable(valueAccessor()); 
     if ((value === null) || (value === undefined)) 
      value = ""; 
     $(element).html($(element).html() + " " + _.escape(value)); 
    } 
}; 

它正常工作與聯模板，

<!-- This code works --> 
<div class="accordion-inner"> 
    <!-- ko foreach:categories --> 
    <div class="control-group"> 
     <div class="controls"> 
      <label class="checkbox" data-bind="checkboxLabelText: title"> 
       <input type="checkbox" data-bind="checked: checked" /> 
      </label> 
     </div> 
    </div> 
    <!-- /ko --> 
</div> 

而不是作品：：我創建了一個自定義綁定複選框顯示，但沒有綁定。

<!-- This code does not work --> 
<div class="accordion-inner" data-bind="template: {foreach: categories, name: 'checkboxEditorTemplate'}"> 
</div> 
<script type="text/html" id="checkboxEditorTemplate"> 
    <div class="control-group"> 
     <div class="controls"> 
      <label class="checkbox" data-bind="checkboxLabelText: title"> 
       <input type="checkbox" data-bind="checked: $data.checked()" /> 
      </label> 
     </div> 
    </div> 
</script> 

任何幫助？

Answer 1

如您所見，text綁定將用指定的文本替換其內容。在你的情況，我覺得更好的選擇是構建您的標記，如：

<label class="checkbox"> 
    <input type="checkbox" value="option1"> 
    <span data-bind="text: title"></span> 
</label> 

採用這種結構，就可以避免自定義綁定，並達到相同的結果。