Question

这是plunker：

 <select [(ngModel)]="selectedValue">
    <option 
      *ngFor="let item of items" 
      [attr.selected]="item.Id == selectedValue.Id ? '' : null" 
      [ngValue]="item" >
        {{item.Text}}
    </option>
  </select>

export class App {
      selectedValue: DataItem = {Id: 2, Text: 'two'};
      items: DataItem[] = [{Id: 1, Text: 'one'}, {Id: 2, Text: 'two'}, {Id: 3, Text: 'three'}]]; }

export class DataItem{
  Id: number;
  Text: string;
}

尝试了各种谷歌和stackoverflow答案中的许多建议，但无法使其正常运行。有人有解决方案吗？我对建议不使用ngModel或处理更改事件的解决方案不感兴趣。

Answer 1

将[(ngModel)]="selectedValue"更改为[(ngModel)]="selectedValue.Id"和

[ngValue]="item"至[ngValue]="item.Id"

<select [(ngModel)]="selectedValue.Id">
    <option 
      *ngFor="let item of items" 
      [attr.selected]="item.Id == selectedValue.Id ? '' : null" 
      [ngValue]="item.Id" >
        {{item.Text}}
    </option>
  </select>

或试试这个

 <select  [(ngModel)]="selectedValue.Id">
    <option *ngFor="let item of items" [value]="item.Id">
            {{item.Text}}
    </option>
</select>

当与对象一起使用时，Angular 4选择初始值未正确选择

1 个答案: