Angular 8 Reactive Form，设置默认选定选项

Question

抱歉，当我打开对话框模型表单时，我很难在下拉列表中设置默认选定选项。

我有两个模型

1. 部门
2. 员工

我还有两个组件，即员工和员工列表，员工列表组件负责加载表中的所有员工列表，员工组件负责加载单个员工..

在员工列表中，我设置了单击事件，该事件调用编辑功能并在表单中填充选定的行以进行编辑。但是当表单打开时，通过选择选项打开的其他字段没有出现，我不知道为什么。

employee.ts

  dept: any;

     ngOnInit() {
      this.loadAllDept();
      this.selected = this.employeeService.form.get('department').value;
      }

    loadAllDept(){
        this.employeeService.getAllDepartments().subscribe(
          data => {
            this.dept = data;
          }
        );
      }

还有我的employee.html

    <mat-grid-tile>
      <div class="reg-control-container">
        <mat-form-field>
          <mat-select [(value)]="selected"  formControlName="depatment" placeholder="Class">
            <mat-option>None</mat-option>
            <ng-container>
              <mat-option *ngFor="let d of dept" value="{{d.id}}"> {{ d.name }}</mat-option>
            </ng-container>
          </mat-select>
        </mat-form-field>
      </div>
    </mat-grid-tile>

但它没有将默认值设置为下拉列表。

如下图所示，我可以输出默认选择和选项列表，但我无法设置。

as shown below

Answer 1

看看这个例子，https://stackblitz.com/edit/angular-5short

请记住，您需要使用 Angular 提供的属性绑定语法来绑定选项的值，将要为其分配值的属性包含在方括号 ([]) 中。这样，只要将相同的值传递给所需的 FormControl，它就应该正确应用默认选项。