如何操作其值为来自 ngFor 的属性的 ngmodel

Question

我想知道如何操作具有 ngModel 属性的输入，该属性来自 ngFor，并在组件中更改其值，接下来我将展示我的代码HTML正面这个想法是 this [(ngModel)] = "item.days" 根据您单击的按钮添加和减去，但我不知道如何引用它以在组件函数中操作它，因为它应该改变动态地，我试图验证输入不小于 0，但它对我不起作用，所以我选择隐藏输入。如果有人可以帮助我，我将不胜感激，问候。

Answer 1

您需要将索引传递给您的更改值函数以了解要更改的值。更改数组中的值将触发 Angular 的更改检测并更新 html 中的 ngModel。

changeValue(value, index): void {

    this.complexities[index].days += value;

    if (this.complexities[index].days < 0) {

      this.complexities[index].days = 0;

    }

  }

然后你的按钮看起来像

<button

  type="button"

  class="btn btn-default btn-xs rounded"

  (click)="changeValue(-1, i)">

并为另一个传递+1。验证输入的一种简单方法是将以下行添加到 <input> 标记

(change)="changeValue(0, i)"

这不会更改天数，但如果输入负值，则会将值设置为 0。