Html 敲除选择2按对象设置初始值

我有一个Knockout.js web应用程序，其中有一个select2下拉列表。我想将id和文本值绑定到变量，而不仅仅是id。以下是我的数据：

var cars = [{id: 1, name: 'Honda'}, {id: 2, name: 'Toyota'}, {id: 3, name: 'Dodge'}];
var selectedCar = ko.observable();

这是我的html：

<select data-bind="value: selectedCar, optionsCaption: 'Select', optionsText: 'name', options: cars"></select>

唯一的问题发生在加载页面并希望将下拉列表设置为特定值时。即使在呈现html之前，

selectedCar

变量设置为

{id:1，name:'Honda'}

当页面呈现下拉列表时，下拉列表没有设置为任何内容，它只是设置为占位符“Select”

---

我做错了什么？

如果要将id和文本值绑定到变量，需要使用

选项value

绑定并将整个上下文绑定到它（

$data

）

让我们用小提琴来测试这一切：

var viewModel=function（）{
var self=这个；
self.cars=[{id:1，名称：'Honda'}，{id:2，名称：'Toyota'}，{id:3，名称：'Dodge'}]；
self.selectedCar=ko.observable（self.cars[0]）；
};
应用绑定（新的viewModel（））

选择框的
值将成为与所选项目或
选项值
参数中设置的属性相对应的对象。因此，对于对象，设置的选定值必须与数组中存在的实例相同。拥有一个对象的不同实例恰好在结构上是等价的是不够的

对于这种情况，我发现更容易将选择框的值绑定到对象的唯一id。然后可以通过计算值将该id映射到所需的实际实例


函数视图模型（数据）{
this.cars=data.cars；
this.selectedCarId=ko.可观察（data.selectedCarId）；
this.selectedCar=ko.computed（（）=>{
让selectedCarId=this.selectedCarId（）；
返回此.cars.find（c=>c.id==selectedCarId）；
});
}
让模型={
汽车：[
{id:1，名称：'Honda'}，
{id:2，名称：'Toyota'}，
{id:3，名称：'Dodge'}
],
选定的carid:2
};
应用绑定（新的视图模型（model），document.getElementById（'content'）

选定的CARID：

所选车辆：

好问题，通过回答这个问题学到了一些新东西。。对答案有什么想法吗？以这种方式设置
选项值
是不必要的，所选项目被暗示为值。是的，但您如何设置初始值并同时满足OP将id和文本绑定到“selectedCar”的要求？我认为在这一点上，optionsValue是必要的。设置
optionsValue:$data
不会满足您的想法<该上下文中的code>$data
实际上是视图模型，它不是该属性的有效值。因此，实际上，它使用的是默认行为（所选项目设置为该值）。但是，您已经正确指出，
selectedCar
的初始值是通过访问数组中的实际实例正确设置的。
selectedCar = {id: 1, name: 'Honda'};

<select data-bind="value: selectedCar, 
                   optionsCaption: 'Select', 
                   optionsText: 'name', 
                   options: cars, 
                   optionsValue: $data"></select>

this.cars = [{id: 1, name: 'Honda'}, {id: 2, name: 'Toyota'}, {id: 3, name: 'Dodge'}];
this.selectedCar = ko.observable();