Mat-select 不是 selecting 选项

Question

我有一个带有 mat-select 字段的表单。我使用来自后端的值通过 API 调用初始化该字段。但是 mat-select 不是 selecting 选项中的任何值。我尝试了所有可能的答案，我在 Stack Overflow 中从之前关于这个问题的问题中找到了答案，但是 none 这些答案有效。

我的组件的 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>

在我的级别数组中，它只能有值 1、2、3、4，响应也将包含 1-4 的值。我已经使用控制台日志检查过数据是否正确。基本上，在这种形式中，除了这个 mat-select 字段外，我有几个字段都可以正常工作。其他字段不是mat-select字段.

Answer 1

您可以在此 stackblitz 2 个工作示例中找到您的问题。

您共享的代码中的一个问题是 mat-option 值上缺少 []，另一个我认为是使用从 0 开始的索引在您可以拥有的数据中放置一个偏移量在你的表单中

如果还不是问题不在这部分代码

Mat-select 不是 selecting 选项

Mat-select is not selecting option

forms

angular-material

angular