更改一个选择，其他选择更改

Question

我的应用程序有问题。我必须使用编写几个选择 ngValue ngModel。 问题是，当一个更改时，其他选择则更改为相同的值-为什么？

HTML：

<select placeholder="Contrat" name="contrat"  [(ngModel)]="contrat" class="form-control">

      <option [ngValue]="contrat" *ngFor="let contrat of contrats"> {{contrat.id}}</option>
    </select>

    <select placeholder="Contrat" name="contrat"  [(ngModel)]="contrat" class="form-control">

      <option [ngValue]="contrat" *ngFor="let contrat of contrats"> {{contrat.id}}</option>
    </select>

    <select placeholder="Contrat" name="contrat"  [(ngModel)]="contrat" class="form-control">

      <option [ngValue]="contrat" *ngFor="let contrat of contrats"> {{contrat.id}}</option>
    </select>

有什么解决方案？

非常感谢。

Answer 1

之所以会这样，是因为您将相同的变量绑定到[（ngModel）]中的每个选择中

您正在使用两种方式的绑定，因此一次选择中的任何更改都会更改变量。 Angular会检测到这一点并更新其他绑定。

Answer 2

在您的情况下，三个选择框都具有相同的[(ngModel)]，因此，当您从选择框中选择一个值时，它将反映另一个值。

因此，对于三个选择标记，您必须使用不同的ngModel