停止 JSON 驱动的 NGX-Formly ngFor 循环覆盖同一页面上网格中的先前表单

Question

在下面的示例中，我有一个 Formly 表单包裹在一个 ngFor 循环中。最后一个表单模型覆盖了所有以前的模型。我怎样才能阻止这种行为？

承载表单循环的父级：

<div class="row">
  <div class="col" *ngFor="let test of sampleModels">

    <app-form [fields]="fields" [model]="test"></app-form>

  </div>
</div>

fields: FormlyFieldConfig[] = [
    {
      key: 'text1',
      type: 'input',
      templateOptions: {
        label: '1',
        placeholder: 'Formly is terrific!',
        required: true,
      },
    },
    {
      key: 'text2',
      type: 'input',
      templateOptions: {
        label: '2',
        placeholder: 'Formly is terrific!',
        required: true,
      },
    }
  ];

  sampleModels = [
    {
      "text1": "1",
      "text2": "2"
    },
    {
      "text1": "3",
      "text2": "4"
    },
    {
      "text1": "5",
      "text2": "6"
    }
  ];

申请表 模型显示正确，但表单始终填充循环中的最后一项。

{{ model | json }}
<hr>
<form [formGroup]="form" (ngSubmit)="submit()">
  <formly-form [model]="model" [fields]="fields" [options]="options" [form]="form"></formly-form>
  <button type="submit" class="btn btn-success submit-button">Submit</button>
</form>



  @Input() model: any;
  @Input() fields: any;
  public form = new FormGroup({});

  options: FormlyFormOptions = {
    formState: {
      awesomeIsForced: false,
    },
  };

  submit() {
    if (this.form.valid) {
      console.log(this.model);
    }
  }