Question

这是基于淘汰赛的答案编辑器的片段

<!-- ko foreach: Answers -->
<div class="qa-box" data-bindx="event: { mousedown: mouseDown, dragend: dragEnd, dragstart: dragStart }">
  <div class="qa-body">
    <div class="radio">
      <label>
        <input type="radio" data-bind="attr: { name: 'Q' + $parentContext.$index(), value: $index }, checked: $parent.CorrectAnswer" /><span></span>
        Tick the correct answer
        <span data-bind="text:$parent.CorrectAnswer"></span>
      </label>
      <a href="#" data-bind="click: $parent.remove.bind($parent)">
        <i class="fa fa-times"></i>
        Remove this answer
      </a>
      <div class="form-control" contenteditable="true" data-bind="ckeditor: $data, attr: { id: 'Q' + $parentContext.$index() + 'A' + $index() }"></div>
    </div>
  </div>
</div>
<!-- /ko -->
<div>CorrectAnswer: <span data-bind="text: CorrectAnswer"></span></div>

你会注意到我在单选按钮标签的末尾添加了一个绑定范围，这样我就可以看到当我与UI交互时CorrectAnswer observable会发生什么。这就是我知道它正确绑定到视图模型的方式。单击单选按钮或其标签会完全按预期更改CorrectAnswer的值。

这也让我知道CorrectAnswer包含我期望的值。

让我们仔细看看绑定，以防它不明显。

attr: { name: 'Q'+$parentContext.$index(), value: $index }, checked: $parent.CorrectAnswer

给定问题的所有答案都获得相同的名称Qx和项目列表位置提供的值。单击某个项目时，其列表位置将写入CorrectAnswer。这确实发生了，因为新值出现在告密者div中。

那么，当其他一切都没问题时，有什么可能阻止UI初始化？

Answer 1

这不是初始化问题，而是类型兼容性问题。无线电输入的值是string类型。我的视图模型提供的值是类型编号。 Knockout进行了强有力的比较，并且无法识别匹配。

另见Radio buttons Knockoutjs

KO无线电有效，但没有初始化为已检查

1 个答案: