angular - 在 ngFor 中使用选择元素时出现“属性为只读”错误

Question

我有一个名为的对象数组，timingOfApptReminders并用ngFor. 数组看起来像这样：

[
  {
    daysUntilAppt: 1, 
    hoursUntilAppt: 0,
    minutesUntilAppt: 0,
  },
  {
    daysUntilAppt: 0, 
    hoursUntilAppt: 1,
    minutesUntilAppt: 0,
  },
]

我的ngFor循环为每个对象显示一行，并且对象<mat-select>内部的每个属性都有一个元素。

正确显示ngFor每个对象，但是，如果我单击其中一个mat-select元素并进行更改，则会收到以下错误：

错误类型错误：““daysUntilAppt”是只读的”

这是我的代码：

  <div *ngFor="let item of timingOfApptReminders; index as i; let last = last">

    <!-- Days -->
    <mat-form-field>
      <mat-label>Days</mat-label>
      <mat-select [(ngModel)]="item.daysUntilAppt" name="daysUntilAppt-{{i}}">
        <mat-option 
          *ngFor="let day of days" 
          [value]="day"
        >
          {{day}}
        </mat-option>
      </mat-select>
    </mat-form-field>

    <!-- Hours -->
    <mat-form-field>
      <mat-label>Hours</mat-label>
      <mat-select [(ngModel)]="item.hoursUntilAppt" name="hoursUntilAppt-{{i}}">
        <mat-option 
          *ngFor="let hour of hours" 
          [value]="hour"
        >
          {{hour}}
        </mat-option>
      </mat-select>
    </mat-form-field>

    <!-- Minutes -->
    <mat-form-field>
      <mat-label>Minutes</mat-label>
      <mat-select [(ngModel)]="item.minutesUntilAppt" name="minutesUntilAppt-{{i}}">
        <mat-option 
          *ngFor="let minute of minutes" 
          [value]="minute"
        >
          {{minute}}
        </mat-option>
      </mat-select>
    </mat-form-field>
  </div>

我怀疑这与我正在做的方式有关[(ngModel)]，但我不太确定如何以正确的方式进行操作，以便我更改正确对象中正确属性的值。我究竟做错了什么？

标签： angularngforangular-ngmodel