Question

我有以下代码

<select name="role" [(ngModel)]="user.role">
    <option *ngFor="let r of roles" [ngValue]="r">{{r.name}}</option>
</select>

其中角色是对象：

[{"id":1, "name":"user"}, {"id": 2, "name":"admin"}]

和user.role例如：

{"id":1, "name":"user"}

我希望初始值是user.role，我已经尝试了很多类似ngInit的方法，但是并没有完成工作。

Answer 1

您可以尝试使用此解决方案。

我已经在Stackblitz上创建了一个演示

在选择中使用[compareWith] =“ compareObjects”作为使用对象

component.html

<select name="role" [compareWith]="compareObjects" [(ngModel)]="user.role">
    <option *ngFor="let r of roles" [ngValue]="r">{{r.name}}</option>
</select>

component.ts

  user = {
    role: { "id": 1, "name": "user" }
  }
  roles = [
    { "id": 1, "name": "user" }, 
    { "id": 2, "name": "admin" }
  ]

  compareObjects(o1: any, o2: any): boolean {
    return o1.id === o2.id && o1.name === o2.name;
  }

角度6选择：设置初始值

1 个答案: