Javascript HTML复选框和meteorJS

我不完全理解meteorJS TODO教程中的这段代码：

HTML:

因此，程序正在侦听

类：toggle checked

上的click事件，并使用

$set

操作符更新mongoDB，以创建一个属性“checked”，其值不等于HTML输入类的“checked”属性：

toggle checked

---

为什么不相等？

因为数据库中的

checked

字段包含一个布尔值，所以当呈现复选框时，它使用

checked

值作为其状态。当复选框状态更改时，

选中的

字段也应更改

让我们用一个非常基本的例子来应用这个逻辑：

Action        this.checked value    Initial checkbox state      Updated checked value
===========================================================================================

None          false                 not-checked                 false (no action triggered)
Click         true                  checked                     true
Click         false                 not-checked                 false

使用$set运算符更新mongoDB，以创建一个属性“checked”，其值不等于HTML输入类的“checked”属性：toggle checked

从您的上述陈述中，我觉得您似乎被

这一点弄糊涂了。在事件处理程序中，
this
实际上引用了当前模板的数据上下文，因此，
this.checked
不是HTML元素的checked属性值

因此，当未检查任务时，其已检查字段中的值将为false。由于，
this
引用的是此数据上下文，
this.checked
也为false。但是，当您单击
.toggle checked
复选框时，您希望将选中字段的值设置为true。因此，我们将checked字段的值设置为
！此选项已选中
。在本例中，我们没有使用HTML元素的checked值来更新checked状态。
HTML看起来不好。另外，JavaScript似乎并不完整。你能让它变得更好吗？在底部编辑时查看预览。抱歉-这是我第一次使用stackoverflow。没问题。你能不能让它变得更好？
"click .toggle-checked": function(){
  Tasks.update(this._id, {
    $set: {checked: ! this.checked}
  });

Action        this.checked value    Initial checkbox state      Updated checked value
===========================================================================================

None          false                 not-checked                 false (no action triggered)
Click         true                  checked                     true
Click         false                 not-checked                 false