Angular / FormBuilder 为 mat-select 下拉菜单设置默认值

时间:2021-05-26 18:47:34

标签: angular formbuilder angular2-formbuilder

我正在尝试为我的项目中的下拉列表设置默认值。我尝试了几种不同的方法来做到这一点,但我尝试过的任何方法似乎都不起作用。我尝试使用 mat-select 中的 [(value)] 和 formBuidler 上的 .setValue(...) 函数设置默认值。我已经在 stackblitz 中复制了我的代码结构。有谁知道我缺少什么或为什么我目前拥有的不起作用?任何帮助表示赞赏

2 个答案:

答案 0 :(得分:2)

我可以在您的代码中看到 2 个问题:

  1. 你需要定义 formBuilder 而不是只用 type 定义它
export class AppComponent implements OnInit {
    myForm: FormGroup;
    formBuilder: FormBuilder;   // this isn't the right definition of the class;
} 

这应该改为

 export class AppComponent implements OnInit {
     myForm: FormGroup;
     formBuilder: FormBuilder = new FormBuilder();  
     // or define it by constructor
     // since you are working with typescript you can define in this way
    constructor(private formBuilder: FormBuilder) { }
     // typescript will transform this to  
     // constructor() { 
     //     this.formBuilder = new FormBuilder()
     // }
}
  1. 第二个问题是[formGroup]="myForm"您应该在模板中添加 formGroup

检查复制示例: https://stackblitz.com/edit/angular-material2-issue-default-select-dppuqx?file=app/app.component.html

答案 1 :(得分:1)

使用 FormBuilder 时,您可以将控件的初始值作为第一个参数传递:

this.formBuilder.control(initialValue, ...)