使用angular7中动态创建的输入在formControlName中设置值

Question

  

component.ts代码

constructor(private fb: FormBuilder) { }

  ngOnInit() {
    this.assesmentForm = this.fb.group({
      test:new FormControl(),
      Assesments:this.fb.array([])
    })
    var test:any = [{0:1},{1:2},{2:4},{3:5},{4:6}]

    for(let s of test){
      this.Add()
    }

  }
  Add()
  {
    let assesments = this.assesmentForm.get("Assesments") as FormArray;
    assesments.push(this.createRow())
  }
  createRow()
  {
    return this.fb.group({
      student_name:new FormControl(),
      student_class:new FormControl(),
      engagementGrade:new FormControl(),
      technicalGrade:new FormControl(),
      projectGrade:new FormControl(),
      total:new FormControl(),
      final_grade:new FormControl()
    })
  }
  totalGrade(event,i:number)
  {
    alert(i)
  }

这是我的component.ts文件。

  

我的HTML部分是：

 <tr formArrayName="Assesments" *ngFor="let p of this.assesmentForm.get('Assesments').controls;let i=index" id="stu_{{i}}">
            <td [formGroupName]="i">
              <select formControlName="engagementGrade"  id="eng_{{i}}" (change)="totalGrade($event,i)">
                <option value="1">1</option>
                <option value="2">2</option>
                <option value="3">3</option>
                <option value="4">4</option>
              </select>
            </td>
            <td [formGroupName]="i">
              <select formControlName="technicalGrade" id="tech_{{i}}" (change)="totalGrade($event,i)">
                <option value="1">1</option>
                <option value="2">2</option>
                <option value="3">3</option>
                <option value="4">4</option>
              </select>
            </td>
            <td [formGroupName]="i">
              <select formControlName="projectGrade" id="project_{{i}}" (change)="totalGrade($event,i)">
                <option value="1">1</option>
                <option value="2">2</option>
                <option value="3">3</option>
                <option value="4">4</option>
              </select>
            </td>
            <td [formGroupName]="i">
              <input type="text" formControlName="total" id="total_{{i}}" />
            </td>
            <td [formGroupName]="i">
              <input type="text" formControlName="final_grade" id="grade_{{i}}" />
            </td>
            <td [formGroupName]="i">
              <button class="btn btn-success" (click)="saveIndividual(this.assesmentForm.controls['Assesments'].value[i])">Save</button>
            </td>
          </tr>

我想根据所选的评分标准来计算总成绩。我尝试了几种方法来为选定的项目获取价值，并尝试在总输入中设置它们，但这不会给我令人满意的结果。