Angular 未根据选择的ngModel选择值

我从BE中获取了一个选择选项，一旦获取，我就填充选项。 ngModule是在另一个步骤中设置的，与其中一个选项相同。 这个结果我寻找的是，该选项，是我的模型相同的显示

    <select class="form-control" id="accident-" [(ngModel)]="accident" required>
      <option *ngFor="let a of accidents" [ngValue]="a">{{a.text | titlecase}}</option>
    </select>

{{a.text | titlecase}}

---

Br

请将

id

属性添加到事故对象，然后

<select class="form-control" id="accident-" [(ngModel)]="selectedAccident.id" required>
      <option *ngFor="let a of accidents" [ngValue]="a.id">{{a.text | titlecase}} 
      </option>
</select>

{{a.text | titlecase}}

---

在这里，您必须根据您在TS文件中的业务要求设置

selectedacident

，请向意外对象添加

id

属性，然后

<select class="form-control" id="accident-" [(ngModel)]="selectedAccident.id" required>
      <option *ngFor="let a of accidents" [ngValue]="a.id">{{a.text | titlecase}} 
      </option>
</select>

{{a.text | titlecase}}

---

在这里，您必须根据业务需要在TS文件中设置

selectedacident

，Angular使用对象标识选择选项

要自定义默认选项比较算法，

支持

compareWith

输入

HTML文件：

<select class="form-control" id="accident-" [(ngModel)]="accident" required [compareWith]="byAccident">
  <option *ngFor="let a of accidents" [ngValue]="a">{{a.text | titlecase}}</option>
</select>

byAccident(item1, item2) {
   return item1 && item2 ? item1.text === item2.text : item1 === item2;
}

---

参考：

Angular使用对象标识选择选项

要自定义默认选项比较算法，

支持

compareWith

输入

HTML文件：

<select class="form-control" id="accident-" [(ngModel)]="accident" required [compareWith]="byAccident">
  <option *ngFor="let a of accidents" [ngValue]="a">{{a.text | titlecase}}</option>
</select>

byAccident(item1, item2) {
   return item1 && item2 ? item1.text === item2.text : item1 === item2;
}

参考：