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.delegate更新值后，

input会还原更改。要跟踪更改，您可以向父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，而不仅仅是复选框。如果这是不合需要的，您可以将委托移动到特定元素。

Aurelia不更新数组中对象的值

1 个答案: