在淘汰赛中获取选定的选项文本答案

【问题标题】：get selected option text in knockout在淘汰赛中获取选定的选项文本
【发布时间】：2016-06-29 16:46:47
【问题描述】：

我正在使用 knockoutjs 绑定一个选择列表。这是Sample ，我想获取选定的选项文本而不是选定的值。

如何使用 knockoutjs 获得它？

<select id="projectMenu" name="projectMenu" data-bind="   
        value: selectedProject,
        options:        projectFilters,
        optionsText:    'a', 
        optionsValue:   'b',   
        optionsCaption: '-- Select Project --'
    ">
    </select>
<b>Selected Project:</b> <span data-bind="text: selectedProject"></span>

【问题讨论】：

请提供代码示例，而不是简单的链接。
可能重复？ stackoverflow.com/questions/11112435/…
如果重复然后呢？这个问题从来没有得到回答，这是否意味着没有人可以问？

标签： javascript jquery knockout.js

【解决方案1】：

最简单的方法是删除 optionsValue 绑定。当您不指定 optionsValue 绑定时，整个项目将是选定的值。

<select id="projectMenu" name="projectMenu" data-bind="   
        value: selectedProject,
        options:        projectFilters,
        optionsText:    'a',         
        optionsCaption: '-- Select Project --'
    ">
    </select>
<b>Selected Project:
<span data-bind="text: selectedProject() ? selectedProject().a : 'no selection '"></span>

See fiddle

【讨论】：

它适用于订阅事件而不是更改事件。无论如何都是很好的解决方案伙伴。感谢您的工作。顺便提一下，小提琴对我来说很好用。

【解决方案2】：

就我而言，仅使用简单的绑定是不可能的。但是您可以轻松创建根据 optionValue 选择 optionText 的 computedObservable

vm.selectedOption= ko.computed(function () { 
   for (var i = 0; i < this.projectFilters().length; i += 1) {
       var data = this.projectFilters()[i];
       if (data.a === this.selectedProject()) {
           return data.b;
       }
   }
   return null;
}, vm);

【讨论】：

我不能这样做，因为我不想迭代一个大集合，而且我的视图中有很多选择列表。所以它会降低性能。
@MotaChuha 除非有非常大的集合应该可以正常工作 - 现代 PC 相当快;)。我建议在拒绝此解决方案之前进行性能测试 - 也许性能稍慢一点是可以接受的。如果不是，您可能应该编写自定义敲除绑定来实现要求。

【解决方案3】：

vm.selectedCountryName = ko.computed(function () {
        var text = '';
        ko.utils.arrayForEach(vm.countries(), function (item) {
            if (item.CountryId == vm.selectedCountry()) {
                text = item.CountryName;
                return;
            }
        });
        return text;
    });

【讨论】：