in the following code if I use
formControlName="work_sample_description"
for textarea , the text area does not load with the value of
WorkSampleObj.work_sample_description
if I remove
formControlName="work_sample_description"
code runs as expected..!
How to fix it?
<form [formGroup]="workSampleEditForm" (ngSubmit)="edit_work_sample(workSampleEditForm.value)">
<mat-card-content>
<mat-form-field appearance="fill" >
<textarea matInput rows="7" formControlName="work_sample_description">{{WorkSampleObj.work_sample_description}}</textarea>
</mat-form-field>
</mat-card-content>
<mat-card-actions>
<button mat-button *ngIf="workSampleEditForm.disabled" (click)="workSampleEditForm.enable()">Edit description</button>
<button mat-button *ngIf="workSampleEditForm.enabled">Save Changes</button>
<button mat-button>Delete</button>
</mat-card-actions>
</form>
I tried also this
workSampleEditForm = new FormGroup({
work_sample_description : new FormControl(this.WorkSampleObj.work_sample_description,[])
});
---------------
<textarea matInput rows="7" [formControlName]="'work_sample_description'"></textarea>
CodePudding user response:
[(ngModel)] solve my issue.
<textarea matInput rows="7" formControlName="work_sample_description"
[(ngModel)]="WorkSampleObj.work_sample_description"></textarea>
CodePudding user response:
The issue is, that [formControlName]
expects string name of the given form control. And you are passing reference to it. If you form group workSampleEditForm
contains work_sample_description
form control then just pass its name as a string (put the name in the single quotes)
<textarea
matInput rows="7"
[formControlName]="'work_sample_description'">
</textarea>
See stackblitz