I'm trying to set value of 2 fields <input matInput>
abnd <mat-select>
programatically. For text input everything works as expected however for the <mat-select>
on the view this field is just like it would have value off null
. But if I would call console.log(productForm.controls['category'].value
it prints correct value that I set programmatically. Am I missing something?
Here is the code:
form config:
productForm = new FormGroup({
name: new FormControl('', [
Validators.required
]),
category: new FormControl('', [
Validators.required
]),
});
setting value:
ngOnInit() {
this.productForm.controls['name'].setValue(this.product.name);
this.productForm.controls['category'].setValue(this.product.category);
}
}
html:
<mat-form-field>
<mat-select [formControlName]="'category'"
[errorStateMatcher]="errorStateMatcher">
<mat-option *ngFor="let category of categories" [value]="category">
{{category.name}}
</mat-option>
</mat-select>
</mat-form-field>
See Question&Answers more detail:
os 与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…