Html 如何在选择中使用对象子对象作为值而不匹配属性名

我想将select字段的值设置为repairData属性reportShiftId中指定的值，但它不起作用。另一方面，如果我在repairData中设置Shift对象并使用reportShift.id引用它，它就会工作

在我更改repairData.reportShiftId（选择的ng模型）时的不工作代码中，选择选项不会更改，但在我在选择中手动选择某个对象后，ngModel开始正常工作

非工作代码：

-

-

---

如何使用reportShiftIdnumber而不是reportShift.idShift.number？

尝试实现类似以下功能的比较：

<select class="form-control" name="shift" [compareWith]="compareWithFunction" [(ngModel)]="repairData.reportShiftId">
      <option *ngFor="let shift of shifts" [ngValue]="shift.id">{{shift.name}}</option>
</select>

 compareWithFunction(item1,item2){
   return item1 && item2 ? item1.id === item2.id : item1 === item2;
  }

---

我知道问题出在哪里。 在我将name html属性从shift改为reportShift后，它就开始工作了

---

实际上，我认为我有多个同名的select，这可能是问题所在。

ChangeDetectionStrategy.onPush是否应用于组件，问题中演示了哪个模板？我是angular的新手。我想不是。它只是由visual studio代码插件角度文件生成的普通组件。未提供问题的原因。我只是想猜猜怎么了。component.ts文件中是否有ChangeDetectionStrategy代码段？它应该在@component{…here…}配置中。如果是，请尝试将其删除。应该对你的问题有所帮助否，它只有选择器、templateUrl和StyleUrl，我从来没有在任何组件中更改@component{}。检查此stackBlitz将默认比较功能更改为自定义功能，如果我想为整个模型而不是仅为Id实现选择，它将非常有用。在stackBlitz上，但是，如果我把它粘贴到我的应用程序上，它就不起作用了，但我知道了如何让它工作。我很高兴能帮上忙

<select class="form-control" name="shift" [(ngModel)]="repairData.reportShiftId">
      <option *ngFor="let shift of shifts" [ngValue]="shift.id">{{shift.name}}</option>
</select>

export class RepairData {
    reportShift: Shift;
    ...
}

<select class="form-control" name="shift" [(ngModel)]="repairData.reportShift.id">
      <option *ngFor="let shift of shifts" [ngValue]="shift.id">{{shift.name}}</option>
</select>

<select class="form-control" name="shift" [compareWith]="compareWithFunction" [(ngModel)]="repairData.reportShiftId">
      <option *ngFor="let shift of shifts" [ngValue]="shift.id">{{shift.name}}</option>
</select>

 compareWithFunction(item1,item2){
   return item1 && item2 ? item1.id === item2.id : item1 === item2;
  }