javascript - Knockout 未将 Json 绑定(bind)到多个 Select

Question

我无法使用 Knockout 将 json 数据绑定(bind)到选择列表。发生的情况是，选择列表是使用每个 json 记录的选项创建的，但它不会将任何数据绑定(bind)到列表。本质上它是一堆空选项。我什至可以在 applyBindings() 之后通过控制台看到 View 模型中的数据，所以我知道数据在那里。我是 knockout 新手，所以我可能会错过一些东西。请帮忙

var resources = [{"Resource":{"Id":1,"Name":"Bob"}},{"Resource":{"Id":2,"Name":"Jim"}}];

var viewModel = { resourceList: ko.observableArray(resources)}
ko.applyBindings(viewModel);


<select multiple="multiple" data-bind="options: resourceList, optionsText: 'Name', optionsValue: 'Id'">

Answer 1

resourceList 中的对象不包含 Name 或 Id 属性，它们包含一个 Resource 对象，该对象确实如此。

您需要将每个资源投影到这些对象并绑定(bind)到该对象:

var viewModel = {
    resourceList: ko.observableArray(resources),
    resourceListProjection: ko.dependentObservable(function () {
        return ko.utils.arrayMap(this.resourceList(), function (o) {
            return o.Resource;
        });
    }, viewModel);
};

或者创建访问器函数来获取适当的属性。

<select multiple="multiple"
    data-bind="options: resourceList,
               optionsText: function (o) { return o.Resource.Name; },
               optionsValue: function (o) { return o.Resource.Id; }">