Javascript 使用剔除可观察数组的数据绑定复选框

我试图重新实现Udacity JavaScript设计模式课程中的一个学生出勤示例。到目前为止，我已经成功地重新创建了该表，并用一些学生数据正确地填充了它，但是当我更改复选框值时，它会出现，而该值在模型中不会更新

例如，当我显示

    debugVM.studentList()[0].days();

在控制台中，输出显示初始考勤数据，而不是复选框的当前状态。可以找到用于此的JSFIDLE

index.html

 <table>
  <thead>
    <tr>
      <th>Student</th>
      <!-- ko foreach: attendance -->
      <th data-bind="html: $data"></th>
      <!-- /ko -->
    </tr>
  </thead>
  <tbody data-bind="foreach: studentList">
    <tr>
      <td data-bind="html: name, click: $parent.debugStudent"></td>
      <!-- ko foreach: days -->
      <td>
      <input type="checkbox" data-bind="value: $data, checkedValue: $data, checked: $data" />
      </td>
      <!-- /ko -->
    </tr>
  </tbody>
</table>

从淘汰赛中

关键点：observableArray跟踪阵列中的对象， 而不是那些对象的状态

在您的例子中，这意味着

天

不应该是可观察数组，而是可观察数组

例如，您可以添加新的viewModel

Day

：

var Day = function(isChecked) {
    this.isChecked = ko.observable(isChecked);
}

然后像这样设置

days

属性

this.days = [];
for (var i = 0; i< student.days.length; i++) {
   this.days.push(new Day(student.days[i] == 1));
}

this.days=[]；
对于（变量i=0；i

看

this.days = [];
for (var i = 0; i< student.days.length; i++) {
   this.days.push(new Day(student.days[i] == 1));
}