我有一个带有 mat-select 字段的表单。我使用来自后端的值通过 API 调用初始化此字段。但是 mat-select 没有从选项中选择任何值。我尝试了所有可能的答案,我在 Stack Overflow 上从之前关于这个问题的问题中找到了答案,但没有一个有效。
我的组件的 ts 文件:
levels = [1, 2, 3, 4];
ngOnInit() {
this.myService.getData.subscribe((res) => {
this.initForm(res);
})
}
initForm (data) {
this.myForm = this.fb.group({
Level: [data ? data : ""]
});
我的组件的 html 文件:
<form [formGroup]="myForm">
<mat-form-field appearance="outline" class="w-100-p">
<mat-label>Level</mat-label>
<mat-select formControlName="Level">
<mat-option value="i" *ngFor="let Level of levels; index as i">{{ Level }}</mat-option>
</mat-select>
</mat-form-field>
</form>
在我的 levels 数组中,它只能有 1、2、3、4 的值,响应也将包含 1-4 的值。我已经使用控制台日志检查过数据是否正确。基本上,在这个表单中,除了这个 mat-select 字段之外,我有几个字段都可以正常工作。其他字段不是 mat-select 字段。
答案 0 :(得分:1)
您可以在此 stackblitz 2 个工作示例中找到您的问题。
您共享的代码中的一个问题是 mat-option
值上缺少 [] 另一个我认为是使用从 0 开始的索引在您可以在您的数据中放置偏移量表格
如果仍然不是问题不在这部分代码中