淘汰赛 - 在多选下拉列表中预选数据答案

【问题标题】：knockout - preselect data in multi select dropdown淘汰赛 - 在多选下拉列表中预选数据
【发布时间】：2014-07-03 11:44:49
【问题描述】：

我有一个IndustryData 可观察数组，它将以以下格式存储数据：

ID Name IsMapped 
1 Name1 0
2 Name2 1
3 Name3 0
4 Name4 1

我正在使用下面提到的select 来绑定数据：

<select class="form-control" data-bind="options: $root.IndustryData, selectedOptions: $root.IndustryDataSelectedValues, optionsText: 'name', optionsValue: 'id'" multiple="multiple"></select>

IndustryDataSelectedValues 是一个可观察数组，它将存储上述select 的选定值，并且最初为空。我的要求是应该在我的multi select 控件中选择IsMapped 值为1 的行，并且这些项目应该在IndustryDataSelectedValues 可观察数组中可用。在上述情况下，Name2 和 Name4 应在我的 multi select 控件中选择，这两项应在 IndustryDataSelectedValues 可观察数组中可用。

我怎样才能在淘汰赛中做到这一点？

【问题讨论】：

标签： knockout.js

【解决方案1】：

有多种方法可以解决这个问题：

你可以有一个可写的计算，它映射到你的IndustryDataSelectedValues
或者如果您只需要在您的视图模型上有一个initialize 方法后初始化您的数组，当数据在IndustryData 中准备好时您调用的方法

所以你需要这样的东西：

initialize: function () {
        this.IndustryDataSelectedValues(ko.utils.arrayMap(
        ko.utils.arrayFilter(this.IndustryData, function (item) {
            return item.IsMapped == 1
        }), function (item) {
            return item.id;
        }));
    }

演示JSFiddle.

使用ko.utils.arrayFilter，您首先选择IsMapped == 1 所在的所有项目，然后使用ko.utils.arrayMap 获取先前找到的项目的id 属性并将这些ID 存储在IndustryDataSelectedValues 中

【讨论】：