Angular 动态创建表单组

我使用angular archwizard作为向导步骤，使用*ngFor

问题是如何为每个步骤创建一个动态表单组，在下面的代码中，我为所有步骤创建了一个表单组，但我想为每个步骤创建一个动态表单组

<aw-wizard #wizard>

   <aw-wizard-step *ngFor="let category of categories">
      <ng-template awWizardStepTitle>
         <span class="custom-title">{{category.categoryLabel}}</span>
      </ng-template>

      <sof-form [border]="false" [formGroup]="parametersForm">
      <sof-sub-form column="2">
         <ng-container *ngFor="let parameter of category.parameters | sortBy: 'order'" [ngSwitch]="parameter.type">
         <sof-form-label>{{parameter.parameterLabel}}
            <span *ngIf="parameter.control  | includes: 'required'" style="color: red">*</span>
         </sof-form-label>
         <sof-form-item style="padding-top: 6px" id="parameters">
            <sof-input [type]="'text'" formControlName="{{parameter.parameterId}}" *ngSwitchCase="'text'"></sof-input>
            <sof-input [type]="'number'" formControlName="{{parameter.parameterId}}" *ngSwitchCase="'number'"></sof-input>
            <sof-monoselect formControlName="{{parameter.parameterId}}" [mode]="'autoComplete'" [options]="parameter.valuesList" bindLabel="label"
            bindValue="value" (onSearch)="onSearchParameter($event, parameter)" *ngSwitchCase="'monoselect'"></sof-monoselect>
            <label class="switch switch-small" *ngSwitchCase="'toggle'">
            <input type="checkbox" name="{{parameter.parameterId}}" formControlName="{{parameter.parameterId}}" (change)="checkboxAction(parameter.parameterId)">
            <span class="slider round"></span>
            </label>
         </sof-form-item>
         </ng-container>
      </sof-sub-form>
      </sof-form>

   </aw-wizard-step>

</aw-wizard>

{{category.categoryLabel}
{{parameter.parameterLabel}
*

{{parameter.parameterLabel}
设i=0；
for（数组的常量项）{
this.form.addControl（'formControlName'+this.i，
新FormControl（null，[需要验证程序]）；
i++；}

{{parameter.parameterLabel}
设i=0；
for（数组的常量项）{
this.form.addControl（'formControlName'+this.i，
新FormControl（null，[需要验证程序]）；
i++；}

请通过删除不重要的标记和代码来简化您的问题，如果您创建和共享stackblitz项目，也会更容易为您提供帮助。通常，您需要在数组中创建表单，以分配它们

[formGroup]=“forms[index]”或基于类别
[formGroup]=“forms[category.id]”
请通过删除不重要的标记和代码来简化您的问题，如果您创建和共享stackblitz项目，也会更容易为您提供帮助。通常，您需要在数组中创建表单，以分配它们
[formGroup]=“forms[index]”或基于类别
[formGroup]=“forms[category.id]”
欢迎来到stackoverflow。除了您提供的答案，请考虑提供一个简要解释为什么和如何修复这个问题。欢迎到StAdvOp溢出。除了您提供的答案，请考虑提供一个简要解释为什么以及如何修复这个问题。
<ng-container *ngFor="let parameter of category.parameters | sortBy: 'order';  let i = index" [ngSwitch]="parameter.type">
<sof-form-label [formControlName]="'formControlName' + i">{{parameter.parameterLabel}}

let i = 0;
for (const item of Array) {
  this.form.addControl('formControlName' + this.i,
    new FormControl(null, [Validators.required]));
i ++;}