Question

如何使用这三个模型来实现选择列表？我这样做：

html：

<ng-container [(ngModel)]='user.id' name="id" >
  <select *ngFor="let userRole of userRoles" required>
    <option *ngFor="let role of roles" [ngValue]="role.role_id">
      {{role.name}}
    </option>
  </select>
</ng-container>

但最后得到“选择”组件的副本。我得到这个错误：

错误错误：未捕获（承诺）：错误：表单没有值访问器名称为'id'的控件错误：没有用于窗体控件的值访问器名称：“ id”

Answer 1

让我们从您的模型开始。

export class User {
  constructor(
    public id: number,
    public role: Role,
  ) {}
}

export class Role {
  constructor(
    public id: number,
    public label: string,
  ) {}
}

现在选择。

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

结果给出了this stackblitz

如何正确实现选择列表？

1 个答案: