Question

我正在尝试将数字数组绑定到我的select元素。我正在使用数字数组，因为这是服务器返回的内容。我有jsFiddle设置来证明问题。

HTML

<select data-bind="selectedOptions: EnvironmentIds" id="EnvironmentIds" multiple="multiple" name="EnvironmentIds">
    <option selected="selected" value="1">Hosting</option>
    <option value="2">Internal</option>
</select>

脚本

function IncidentViewModel() {
    var self = this;

    //Properties
    self.EnvironmentIds = ko.observableArray([1]);
}

var incidentViewModel = new IncidentViewModel();
ko.applyBindings(incidentViewModel);

如果您只是切换到如下字符串数组：

ko.observableArray(["1"])

然后代码按预期工作。但是，我不想使用字符串数组，因为这不是数据的类型。有没有办法绕过这个或者我忽略了一些简单的事情？

Answer 1

Knockout的options绑定使用ko.selectExtensions为option元素提供非字符串值。一个简单的自定义绑定可以对现有选项执行此操作。

ko.bindingHandlers.makeOptionsNumeric = {
    init: function(element) {
        ko.utils.arrayForEach(element.options, function(option) {
            ko.selectExtensions.writeValue(option, +option.value);
        });
    }
};

将此添加到select元素的绑定中。

data-bind="makeOptionsNumeric, selectedOptions: EnvironmentIds"

订单很重要。 makeOptionsNumeric必须在selectedOptions之前运行。如果您尚未使用Knockout 3.0，则需要为绑定提供一些虚拟值（例如makeOptionsNumeric: {}）。

jsFiddle：http://jsfiddle.net/mbest/gUdPq/

Answer 2

JS：

function IncidentViewModel() {
    var self = this;

    //Properties
    self.Environments = [{id: 1, name: 'Hosting'}, {id: 2, name: 'Internal'}]
    self.EnvironmentIds = ko.observableArray([1]);
}

var incidentViewModel = new IncidentViewModel();
ko.applyBindings(incidentViewModel);

HTML：

<select data-bind="options: Environments,
    optionsText: 'name',
    optionsValue: 'id',
    selectedOptions: EnvironmentIds" id="EnvironmentIds" multiple="multiple" name="EnvironmentIds">
</select>

Knockout将不会处理多个选择列表的数字数组

2 个答案: