Javascript 如何以角度形式关联文本字段和复选框

所以我有角度形式的动态表单字段，在点击按钮时添加，但现在我想在每个文本字段前面添加一个复选框。因为我是angular的新手，所以我在实现它时遇到了困难。目前我有这个问题。有人能帮我解决将复选框与输入字段关联的问题吗。这可能很简单，但我无法理解。我从过去的一天开始一直在尝试。非常感谢您的帮助。

像这样试试

template.html

<form [formGroup]="myForm">
        <button type="button" (click)="onAddProduct()">Add Product</button>
            <div formArrayName="productList" *ngFor="let item of productList?.controls; let i = index">
              <div [formGroupName]="i">
                  <label for="">Your row</label>
                  <input formControlName="name">
                  <input type="checkbox" formControlName="selected">
                  <button (click)="removeProduct(group.value,i)">remove</button>
              </div>
            </div>
{{myForm?.value|json}}
</form>

---

这里正在工作

复选框的作用是什么？@Arctezy its捕获与输入字段相关的布尔值，即输入是否为全局字段。对不起，我不明白。“全局字段”是什么意思？@Arctezy将其视为与输入字段相关的附加信息。您可以使用模板驱动的表单吗？如果将输入合并到组中会更容易。

import { Component } from '@angular/core';
import { FormArray, FormGroup, FormControl, FormBuilder } from '@angular/forms'
@Component({
  selector: 'my-app',
  templateUrl: './app.component.html',
  styleUrls: [ './app.component.css' ]
})
export class AppComponent  {
  name = 'Angular';
  public myForm: FormGroup;
constructor(private fb: FormBuilder) {

}
  ngOnInit() {
    this.myForm = this.fb.group({
      name: [],
      productList: this.fb.array([])
    })
  } 

  onAddProduct(group:FormGroup) {
    const creds = this.myForm.controls.productList as FormArray;
    creds.push(this.fb.group({
      name: [''],
      selected:[''] 
    }));
  }

  get productList()
  {
    return this.myForm.get('productList') as FormArray;
  }
  removeProduct(group:FormGroup,index:number)
  {
    (group.get('productList') as FormArray).removeAt(index)
  }


}