Question

如何使用NgFor将响应迭代到FormArray中，基本上我有一个曾经用作form的{{1}}，我也想在dynamic checkbox文件中显示/重复响应，这就是我所做的：

ts.file

html

html.file

export class InquiryResponseMultiselectComponent implements OnInit {
  form: FormGroup;
  summons = [];

  constructor(
    private formBuilder: FormBuilder,
    private inquiryService: InquiryService,
  ) {

    this.form = this.formBuilder.group({
      summons: new FormArray([], minSelectedCheckboxes(1)),
    });

    //subscribe data into summon array
    this.getSummon().subscribe(summons => {
      this.summons = summons;
      this.addCheckboxes();
    });

  }

  getSummonses() {
    return (this.form.controls.summons as FormArray).controls;
  }

  //get data from API
  getSummon() {
    return this.inquiryService.getData().pipe(map((item: RootObject) => item.items));
  }

  //Add into FormArray
  addCheckboxes() {
    const control = new FormControl();
    const formArray = this.form.controls.summons as FormArray;
    formArray.push(control);
  }

}

但是，如果使用上述代码，则无法显示数据；如果Im使用<form [formGroup]="form" (ngSubmit)="submit()"> <label formArrayName="summons" *ngFor="let order of *ngFor="let summon of getSummonses(); let i = index"> <input type="checkbox" [formControlName]="i">{{summon.summonAmt}} </label> </form>，则可以显示*ngFor="let summon of summons"的值，如下所示：

{{summon.summonAmt}}

但是它将冗余/重复数据，我需要建议和指导如何解决此问题，谢谢

如何在Angular反应形式中迭代形式数组

0 个答案: