There is no FormControl instance attached to form control element with name
The creation of your FormGroup
is a little bit wrong. You dont need to wrap the control name in brackets and double quotes. Read more about reactive forms on official angular docs.
Change your creation of FormGroup from this:
this.profileForm = this.formBuilder.group({
["name"]: [this.searchProfile.name, null]
});
to this:
this.profileForm = this.formBuilder.group({
name: [this.searchProfile.name]
});
And you should make some changes in your html. Hint: If you are using reactive forms, you don't need [(ngModel)]
on inputs, remove that. Here is right html for you input:
<form [formGroup]="profileForm" *ngIf="!isLoading">
<input type="text" name="name" formControlName="name" />
</form>
I solved this in this way:
Before:
formControlName="description"
After:
[formControl]="form.controls['description']"
I solved this issue by initializing form once in the component constructor i.e.
constructor() {
this.form = this.initForm();
}
OR
ngOnInit() {
this.form = this.initForm();
}
and remove the re-initialization of the form in the component anywhere in the component without constructor i.e.
this.form = this.initForm();