Question

我正在为knockout.js的选项绑定而苦苦挣扎。当我不使用选项绑定时，像这样

<select id="AddProductSelect" name="chosenSpaProduct">
   <!-- ko foreach: Spa.SpaProductList -->
         <option data-bind="text: Name" ></option>
   <!-- /ko -->
</select>

它工作正常。在下面的行上，我正在尝试使用像

这样的选项绑定

<select data-bind="options: Spa.SpaProductList, optionsText: 'Name'"></select>

select元素中没有任何内容。

Spa.SpaProductList是一个对象数组。关于我做错了什么想法？

编辑：相关的JS：

    $(document).ready(function () {
       var initialData = @Html.Raw(Json.Encode(Model));
       viewModel = new ViewModel(initialData);
       ko.applyBindings(viewModel);
       viewModel.ViewLoaded(true);

       function ViewModel(initialData) {
           var self = this;
           ko.mapping.fromJS(initialData, {}, self); 
           (...)
       }
    }

Answer 1

看起来你错过了optionsValue参数。来自knockout.js documentation：

如果您想让用户从任意JavaScript对象（不仅仅是字符串）数组中进行选择，请参阅optionsText 和optionsValue 参数

以下是他们给出的例子：

<select data-bind="options: availableCountries, optionsText: 'countryName', value: selectedCountry"></select>

Answer 2

我认为你错过了optionsText。

此示例正在运行：（http://jsfiddle.net/geremora/6VmCh/）

HTML：

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

JS：

var Car = function (brand, model) {
   this.brand = brand;
   this.model = model;
};

var viewModel = {
   cars: ko.observableArray([
    new Car("Audi", "A3"),
    new Car("Ford", "Ranger"),
    new Car("Fiat", "500")]),
   selectedCar: ko.observable(), 
 };

 viewModel.selectedCar.subscribe(function (data) {
    console.log(data)
 });

 ko.applyBindings(viewModel);

敲除选项绑定，不显示选项

2 个答案: