Foreach而不是选项绑定...我如何复制"optionsCaption"功能？

Question

本周我一直在与KnockoutJS合作,并且有一个特定的问题,我希望其他人遇到并在我之前解决...

基本上我绑定了一个选择框,但需要能够控制实际的选项标签本身(例如禁用),这意味着我无法使用"选项"绑定,这当然不会给你细粒度控制选项标签......这是我提出的(它的工作原理!)

<select data-bind="foreach: $root.availableLabels, value: Label, enable: !IsConfirmed(), optionsCaption: 'Please select...'">
    <option data-bind="text: Value, value: $data, css: { 'paired-label': IsPaired }, disable: IsPaired"></option>
</select>

我的问题是使用"optionsCaption",因为我使用foreach方法生成内部选项,如果我能够使用在淘汰页面上找到的更简单的"选项"绑定,它就不会自动运行...所以如果我正在迭代的对象具有空的"Label"值,它只显示列表中的第一个,而不是"请选择...",这是我理想的情况.

有没有人知道这方面的方法？我没有发布我的视图模型代码,因为我不确定它实际上是否相关,但如果需要当然只是问!

简而言之,问题是我需要使用foreach以便我可以在选项上设置css/attr绑定,但是仍然需要"未选择"选项.

非常感谢您的帮助!

Answer 1

您可以使用无容器foreach循环在固定的"请选择..."选项后生成选项:

<select data-bind="value: Label, enable: !IsConfirmed()">
    <option value="">Please select...</option>
    <!-- ko foreach: $root.availableLabels -->
    <option data-bind="text: Value, 
                       value: $data, 
                       css: { 'paired-label': IsPaired },
                       disable: IsPaired"></option>
    <!-- /ko -->
</select>

演示:JSFiddle