Aurelia不更新数组中对象的值

Question

我有一个称为的对象数组，options每个选项对象都有一个名为的布尔值showThis。在我的html中，我在options数组上使用了转发器，并且将复选框绑定到showThis属性。我需要更新方法中的值showThis，以便每当值更改时都可以触发保存。但是，绝对不管我做什么，屏幕上的值都不会更新以反映showThis我方法中值的更改。更新值不执行任何操作，使用splice()则不执行任何操作。

这是我的html：

        <div class="row" repeat.for="option of options">
            <div class="col">
                <div class="form-group">
                    <div class="form-check">
                        <input click.delegate="checkChanged(option, $index)" checked.bind="option.showThis" type="checkbox">
                        <label class="form-check-label">
                            ${option.friendlyName}
                        </label>
                    </div>
                </div>
            </div>
        </div>

这是我的（当前版本）checkChanged方法：

checkChanged(option, optionIndex){
    let self = this;
    option.showThis = !option.showThis;
    self.save();
}

我也使用尝试了此版本splice()，没有任何变化：

checkChanged(option, optionIndex){
    let self = this;
    self.options.splice(optionIndex, 1);
    option.showThis = !option.showThis;
    self.options.splice(optionIndex, 0, option);
    self.save();
}

Answer 1

click.delegateinput更新值后还原更改。要跟踪更改，您可以change.delegate向父级添加div。

<div change.delegate="save()">
  <div class="row" repeat.for="option of options">
    <div class="col">
      <div class="form-group">
        <div class="form-check">
          <input checked.bind="option.showThis" type="checkbox">
          <label class="form-check-label">
            ${option.friendlyName}
          </label>
        </div>
      <div>
    </div>
  </div>
</div>

这将调用save上change的所有元素，而不仅仅是复选框触发的事件。如果不希望这样做，则可以将委托移至特定元素。