Question

晚上好，我正在 Angular5 中开展一个项目。特别是我有一个材料选择（ mat-select ），它应该选择我作为用户的角色， mat-select 是这样组成的：

<mat-form-field>
    <mat-select placeholder="Scegli un opzione" [formControl]="form.controls['Ruolo']"  [(ngModel)]="admin.Ruolo">
         <mat-option *ngFor="let key of keys" [value]="key">{{roles[key]}}</mat-option>
     </mat-select>
</mat-form-field>

在我的参考打字稿文件中，我有一个处理所有内容的表单组。事实上，当我从服务器返回用户数据时，我以这种方式分配给表单控件：

this.form.controls.Id.setValue(result.Id);
this.form.controls.Nome.setValue(result.Nome);
this.form.controls.Cognome.setValue(result.Cognome);
this.form.controls.Ruolo.setValue(result.Ruolo);
this.admin = result;

其他值都设置正确，但 Ruolo 字段出现问题，这是一个枚举（数字）。

这是构造函数中的原始设置表单组：

  this.form = this.fb.group({
        Id: [null],
        Nome: [null, Validators.compose([Validators.required, Validators.minLength(3)])],
        Cognome: [null, Validators.compose([Validators.required, Validators.minLength(3), Validators.maxLength(15)])],
        Ruolo: [null, Validators.required],
    });

要完成信息，这是我的班级和枚举：

export class Admin {
     Id: number;
     Nome: string;
     Cognome: string;
     Ruolo: ERolesAdmin;
}
export enum ERolesAdmin {
    SuperAdmin = 1,
    Admin = 2
}

如何让mat-select明白它应该预先选择该值？

所有。

Angular5 - 在mat-select中预选默认值

0 个答案: