I am working on a "Tasks" aplication in Angular 9 and PHP. I run into this a Cannot find control with name: <controll name>
error while trying to pre-populate the update form with data.
该表格如下所示:
<form [formGroup]="updateTask" name="edit_task_form">
<mat-form-field appearance="standard">
<mat-label>Title</mat-label>
<input matInput placeholder="Title" formControlName="title" placeholder="Title">
</mat-form-field>
<mat-form-field appearance="standard">
<mat-label>Short Description</mat-label>
<input matInput placeholder="Short description" formControlName="short-description" placeholder="Short Description">
</mat-form-field>
<mat-form-field appearance="standard">
<mat-label>Full Description</mat-label>
<textarea matInput formControlName="full-description" placeholder="Full Description"></textarea>
</mat-form-field>
<div class="text-center">
<button mat-flat-button type="submit" color="accent" [disabled]="updateTask.pristine || updateTask.invalid">Update</button>
</div>
</form>
在组件中,我有:
taskId: string;
updateTask: FormGroup;
currentTest:any = {};
this._apiService.getTaskInfo().subscribe(res => {
this.Task = res;
let formInfo = this.Task.info;
formInfo.forEach(function(task, index){
console.log(task.key + ": " + task.data);
this.updateTask .get(task.key).setValue(task.data);
}, this)
});
The formInfo
array Im trying to get the task info from looks like this:
[{
"taskId":"5eb45c2738ae2549000ddb0a",
"key":"title",
"data":"Lorem ipsum dolor"
},
{
"taskId":"5eb45c2738ae2549000ddb0a",
"key":"short-description",
"data":"Lorem ipsum dolor sit amet, consectetur adipisicing elit"
},
{
"taskId":"5eb45c2738ae2549000ddb0a",
"key":"full-description",
"data":"Reprehenderit aperiam unde distinctio, fuga magnam asperiores laboriosam expedita fugiat numquam rerum debitis temporibus dolores."
}]
The line console.log(task.key + ": " + task.data)
correctly outputs:
title: Lorem ipsum dolor
short-description: Lorem ipsum dolor sit amet, consectetur adipisicing elit
full-description: Reprehenderit aperiam unde distinctio, fuga magnam asperiores laboriosam expedita fugiat numquam rerum debitis temporibus dolores.
但是,表单字段未填充数据,并且在控制台中出现错误:
Cannot find control with name: 'title'
and so on, for every object in the formInfo
array.
我错过了什么?