Вложенное динамическое отображение форм в отдельной модели в динамических формах - PullRequest
0 голосов
/ 20 мая 2019

Я работаю с https://github.com/udos86/ng-dynamic-forms#form-arrays формами. Я создаю вложенную форму следующим образом.

new DynamicFormArrayModel({
        id: 'attachmentFormArray',
        initialCount: 0,
        groupFactory: () => {
          return [
            new DynamicFormGroupModel({
              id: 'attachment',
              group: [
                this.getControl(attachmentControls, 0),
                this.getControl(attachmentControls, 1),
                this.getControl(attachmentControls, 2),
                this.getControl(attachmentControls, 3),
                new DynamicFormArrayModel({
                  id: 'payment',
                  groupFactory: () => {
                    return this.dfs.fromJSON(paymentControls);
                  }
                }),
              ]
            })];
        }
              })
 <dynamic-ng-bootstrap-form *ngIf="attachementFormGroup" [group]="attachementFormGroup" [model]="formModel"
                                     [layout]="formLayout">
            <ng-template modelId="attachmentFormArray" let-context="context" let-index="index">
              <button type="button" class="btn btn-success btn-sm rounded" (click)="addAnotherPayment(context, index)">
                <i class="fas fa-plus-circle"></i> Add Another Payment
              </button>
            </ng-template>
          </dynamic-ng-bootstrap-form>

<button type="button" class="btn btn-info btn-sm rounded" (click)="addAttachement()">
      <i class="fas fa-plus-circle"></i> Add New Attachement

Метод this.getControl () вернет DynamicInput.

Поведение формы выглядит следующим образом: пользователь может добавлять любое количество вложений, а в каждом вложении пользователь может динамически добавлять любое количество платежей. Проблема, с которой я сталкиваюсь, состоит в том, как я могу показать каждое вложение отдельно в HTML. я использую это

<dynamic-ng-bootstrap-form *ngIf="attachementFormGroup" [group]="attachementFormGroup" [model]="formModel"
                                     [layout]="formLayout">
            <ng-template modelId="attachmentFormArray" let-context="context" let-index="index">
              <button type="button" class="btn btn-success btn-sm rounded" (click)="addAnotherPayment(context, index)">
                <i class="fas fa-plus-circle"></i> Add Another Payment
              </button>
            </ng-template>
          </dynamic-ng-bootstrap-form>

но formModel показывает весь список вложений. Я хочу показать каждое вложение на отдельной загрузочной карте и оплатить вложенной загрузочной картой в каждом вложении.

...