javascript - 复选框不显示 bootstrap 和 knockoutjs 绑定(bind)

Question

出于某种原因，复选框没有呈现在我的 knockout 绑定(bind)标签旁边

<div id="test">
    <label class="checkbox-inline" data-bind="text: repeatDayShortStr()[1]">
        <input id="1" type="checkbox" />
    </label>
</div>

查看模型如下:

var vm = {};
vm.repeatDayShortStr = ko.observableArray(["m","t","w","t","f","s","s"]);
ko.applyBindings(vm);

请看这里的 fiddle : http://jsfiddle.net/2j9tgjr9/

编辑:感谢大家的解决方案，我在标签内输入的原因是因为在 Bootstrap 示例中是这样说的，请参见屏幕截图。

Answer 1

我可以建议这样做吗。

HTML

<div data-bind="template: { name: 'choiceTmpl', foreach: choices, templateOptions: { selections: selectedChoices } }"></div>

<script id="choiceTmpl" type="text/html">
        <input type="checkbox" data-bind="attr: { value: $data }, checked: $item.selections" />
        <span data-bind="text: $data"></span>
</script>

JS

var vm = {
    choices: ["m","t","w","t","f","s","s"],
    selectedChoices: ko.observableArray([])
};

vm.selectedChoicesDelimited = ko.dependentObservable(function() {
    return this.selectedChoices().join(",");
}, vm);

ko.applyBindings(vm);