Question

我是Knockout.js的新手，我找到一个永远不会更新的下拉列表的代码部分。以下是代码：

<div class="col-sm-12 col-xs-9">
    <select class="bs-select" data-width="100px" data-bind="value: measurement">
        <option>Gallons</option>
        <option>Pounds</option>
        <option>Days</option>
    </select>
</div>

Javascript：

var viewModel = function (data) {
var self = this;
self.measurement = ko.observable(measurement);
}
ko.applyBindings(viewModel)

无论我从下拉列表中选择什么选项，它都会显示为Gallons。如果我更改订单并将天或磅放在第一位，即使我更改它也会保持天数或磅数。如果我错过了什么，请告诉我。

编辑1：我尝试在选项列表中添加值。不会改变这个问题。

 <option value="Pounds">Pounds</option>                                                                            
 <option value="Days">Days</option>                                                                            
 <option value="Gallons">Gallons</option>

Answer 1

这是一个有效的jsFiddle：

https://jsfiddle.net/njbLqpmq/

HTML：

<div class="col-sm-12 col-xs-9">
    <select class="bs-select" data-width="100px" data-bind="value: measurement">
       <option value="Pounds">Pounds</option>
       <option value="Days">Days</option>
       <option value="Gallons">Gallons</option>
    </select>
</div>

JS：

var viewModel = function (data) {
   var self = this;
   self.measurement = ko.observable();
}
ko.applyBindings(viewModel)

Answer 2

您可能需要选项绑定。

http://knockoutjs.com/documentation/options-binding.html

这是一个小提琴。

https://jsfiddle.net/0o89pmju/24/

 <select class="form-control" data-width="100px" data-bind="value: measurement, options: availablemeasurements">
    </select>

JS

function viewModel() {
  var self = this;
  this.measurement= ko.observable('');
  this.availablemeasurements=ko.observable(['Pounds', 'Day', 'Gallons']);
}

如果您不想使用选项绑定，只需使用看似有效的值。

 <select class="form-control" data-width="100px" data-bind="value: measurement">
      <option>Pounds</option>
        <option>Day</option>
        <option>Gallons</option>
    </select>

这是小提琴。

https://jsfiddle.net/0o89pmju/25/

下拉列表没有更新Knockout.JS

2 个答案: