KnockoutJS 在模型上选择答案

【问题标题】：KnockoutJS Select on modelKnockoutJS 在模型上选择
【发布时间】：2012-02-09 18:11:56
【问题描述】：

我正在尝试使用 KnockoutJS 绑定一对多映射，其中 1 个邮政编码可以有许多“代理”。我有以下课程：

function CaseAssignmentZipCode(zipcode, agent) {
  var self = this;
  self.zipcode = ko.observable(zipcode);
  self.agent = ko.observable(agent);
}

function Agent(id, name) {
  var self = this;
  self.id = id;
  self.name = name;
}

function ZipcodeAgentsViewModel() {
  var self = this;
  self.caseAssignmentZipCodes = ko.observableArray([]);
  self.agents = ko.observableArray([]);

  jdata = $.parseJSON($('#Agents').val());
  var mappedAgents = $.map(jdata, function (a) { return new Agent(a.Id, a.Name) });
  self.agents(mappedAgents);

  var dictAgents = {};
  $.each(mappedAgents, function (index, element) {
    dictAgents[element.id] = element;
  });

  var jdata = $.parseJSON($('#CaseAssignmentZipCodes').val());
  var mappedZipcodeAgents = $.map(jdata, function (za) { return new CaseAssignmentZipCode(za.ZipCode, dictAgents[za.UserId], false) });
  self.caseAssignmentZipCodes(mappedZipcodeAgents);
}

var vm = new ZipcodeAgentsViewModel()
ko.applyBindings(vm);

我的绑定如下所示：

<table>
  <thead><tr><th>Zipcode Agents</th></tr></thead>
  <tbody data-bind="foreach: caseAssignmentZipCodes">
    <tr>
      <td><input data-bind="value: zipcode"></td>
      <td><select data-bind="options: $root.agents, value: agent, optionsText: 'name'"></select></td>
      <td><a href="#" class="image-button small delete-small no-text" data-bind="click: $root.removeZipcode">Remove</a></td>
    </tr>
  </tbody>
</table>

第一次一切都很好，表格和选择字段显示正确。但是，当我更改任何选择元素上的选定值时，什么都没有发生。我已经将其他元素绑定到它们并且这些元素不会更新，并且我尝试使用 .subscribe() 来监听更新事件，但这也不会触发。

我认为我建立/绑定这些关系的方式有问题，但我无法解决这个问题来挽救我的生命。

谢谢！

【问题讨论】：

标签： javascript knockout.js

【解决方案1】：

我认为你需要添加

self.agents = ko.observableArray([]);

在 ZipcodeUsersViewModel 的顶部

【讨论】：

啊，废话，这是我的错。复制了错误的代码块，所以我有一半的东西给用户，一半给代理。抱歉，我认为现在一切正常。
这是您在 jsfiddle 上的示例：jsfiddle.net/jHBX3 如果您更改上面选择中的值，它也会在下面更改。