javascript - KnockoutJS 将数组中的第一个元素绑定(bind)到 div

Question

Jsfiddle

我试图将数组的第一个元素绑定(bind)到一个 div，但失败得很惨。为什么 john 不出现在 div 中？

<div data-bind="text: seedData[0].firstName"></div>
<select data-bind="options: seedData,
                        optionsText: 'firstName',
                        optionsValue: 'ID',
                        value: data.selectedValue">
</select>

var vm = {

    // Simulated seed data from server
    seedData: ko.observableArray([
    {
        ID: 1,
        firstName: 'John',
        value: '333'
    },
    {
        ID: 2,
        firstName: 'Bob',
        value: '333'
    },
    {
        ID: 3,
        firstName: 'Amy',
        value: '333'
    }]),

    // Simulated data from server
    data: {
        title: ko.observable('This is a sample'),
        selectedValue: ko.observable(2)
    }
};
ko.applyBindings(vm);

Answer 1

由于您正在访问可观察对象的值，因此您必须记住它是一个函数。当绑定(bind)到一个可观察对象(而不是它的子属性)时，你可以离开这个函数，Knockout 会为你做这件事。但是在访问索引时，你必须使用该函数。

所以使用:

<div data-bind="text: seedData()[0].firstName"></div>
<select data-bind="options: seedData,
                        optionsText: 'firstName',
                        optionsValue: 'ID',
                        value: data.selectedValue">
    </select>

http://jsfiddle.net/VLTFB/386/