选项值数据绑定不起作用

Options value data-bind not working

本文关键字:不起作用 数据绑定 选项      更新时间:2023-09-26

我在映射对象的元素并使用Knockout.js将它们绑定到<option>元素时遇到问题。

HTML的相关部分如下:

<!-- ko if: parentObjectExists -->
<!-- ko with: parentObject -->
<div class="form-group">
 <label class="control-label" for="subTaskDistributionInput">Distribution:</label>
 <select id="subTaskDistributionInput" data-bind="options: options.distributions,  optionsText: 'value', value: key" class="form-control input-sm"></select> 
</div>
<!-- /ko -->
<!-- /ko -->    

选项的元素。分布数组包含两个元素,keyvalue。相关Javascript:

function Options(data) {
  var self = this;
  self.distributions = ko.observableArray(data.Distributions);
  //Disposal
  self.isDisposed = false;
  self.dispose = function () {
      self.distributions.dispose();
      self.isDisposed = true;
  };
}

和输出选项标签:

<option value>Average</option>
<option value>Triangular</option>

A Distribution包含两个元素:key(整数)和value(字符串)。value元素确实准确地传递到optionsText中,但key属性根本没有传递到HTML中。我几乎可以肯定这里的问题在于HTML。我尝试过的替代value:绑定是'key', function() { return key; }, $data.keyitem.key,但这些都不起作用。如果有人能看出我在这里遗漏了什么,那将是非常感谢的。

你需要这样做

<select id="subTaskDistributionInput" 
    data-bind="
        options: distributions,
        optionsText: $root.getValue,
        optionsValue: $root.getKey
    " 
class="form-control input-sm"></select>

参见optionsValue代替value

<<p>

小提琴演示/h3>

参见文档

我认为你应该写

optionsValue: 'key'