0

我正在尝试将带有 KnockoutJS 的选择绑定到来自我的模型的预定义值。根据文档,这应该来自value属性,但我无法基于此在下拉列表中预先选择一个值。这是反映我遇到的问题的示例代码:

<script src="Scripts/jquery-1.7.1.js"></script>
<script src="Scripts/knockout-2.0.0.js"></script>

<script>
    $(function () {

        var viewModel =
        {
            Positions: ko.observableArray(
                                            [
                                                { Id: 1, PositionName: 'Point Guard' },
                                                { Id: 2, PositionName: 'Shooting Guard' },
                                                { Id: 3, PositionName: 'Center' },
                                                { Id: 4, PositionName: 'Small Forward' },
                                                { Id: 5, PositionName: 'Power Forward' }
                                            ]),
            Players: ko.observableArray(
                                            [
                                                { Id: 1, Name: 'Derrick Fisher', Position: 'Point Guard' },
                                                { Id: 2, Name: 'Kobe Bryant', Position: 'Shooting Guard' },
                                                { Id: 3, Name: 'Andrew Bynum', Position: 'Center' },
                                                { Id: 4, Name: 'Metta World Peace', Position: 'Small Forward' },
                                                { Id: 5, Name: 'Pau Gasol', Position: 'Power Forward' }
                                            ])
        };

        ko.applyBindings(viewModel);

    });
</script>

在我的绑定中,我想使用一个简单的表格,其中第一列预先选择了查找值,在这种情况下,默认情况下是播放器的“位置”。这是一个例子:

<table>
    <thead>
        <tr>
            <td>Position</td>
            <td>Player</td>
        </tr>
    </thead>
    <tbody data-bind='foreach: Players'>
        <tr>
            <td>
                <select data-bind="options: $root.Positions, optionsText:'PositionName', 
                                value:'$data.Position', optionsCaption: 'Choose...'">
                </select>
            </td>
            <td>
                <span data-bind='text: Name'></span>                                
            </td>
        </tr>
    </tbody>
</table>

查找似乎绑定好了(选择填充了查找中的所有位置值)但是默认情况下未选择给定玩家的位置。谁能发现我在哪里做出了错误的假设或错误?

4

2 回答 2

1

当您不使用optionsValue时,它会将所选对象写入您已绑定的对象value

如果您player有一个单独的对象副本position,那么它将不匹配。

例如,

var a = { Id: 3, Name: 'Andrew Bynum', Position: 'Center' };
var b = { Id: 3, Name: 'Andrew Bynum', Position: 'Center' };

alert(a === b); //false they are not a reference to the same object

因此,您的玩家要么需要使用对同一对象的引用,要么您应该使用 指定optionsValue绑定Id,以便它将 Id 读取/写入玩家的位置属性。

于 2012-03-05T22:06:11.527 回答
0

您还没有显示 $data.Position 的来源。
您可能还需要设置 optionsValue,http ://knockoutjs.com/documentation/options-binding.html

它允许您将值绑定到属性而不是 JS 对象。

于 2012-03-05T21:16:47.943 回答