Создание редактируемой таблицы матов внутри реактивной формы с помощью formarray - PullRequest
Новая
       38

Создание редактируемой таблицы матов внутри реактивной формы с помощью formarray

1 голос
/ 29 мая 2019

Я недавно застрял, создавая действительно большую форму.В основном это простые текстовые поля, но их много, а также массив дочерних объектов.Из бэкэнда (Django Rest Framework) я получаю это как объект с вложенными позициями.Эти дочерние объекты должны отображаться в редактируемой и проверяемой таблице mat с полями mat-form.

Это часть модели: 

export class Auftrag{ // <-- parent
  auftrag: number = null;
  bezeichnung: string = '';
  datum: Date = null;
  ueberwachen: boolean = null;
  erl: boolean = null;
  [...]
  auftragposition:Array<AuftragPosition> = null;  //<-- children
}

export class AuftragPosition {
  id: number = null;
  auftrag: number = null;
  position: number = null;
  menge: number = null;
  einheit: string = "";
  beschreibung: string = "";
  teil_nr: string = "";
  artikel: string = ""
  ep: number = null;
  rabatt: number = null;
 }

Отдельные текстовые поля работают какЯ создаю поля реактивной формы следующим образом (потому что полей действительно много), и это работает: 

this.auftragForm = this.fb.group(new Auftrag()); //fb is a formbuilder

Причина, по которой я это делаю, заключается в том, что я должен написать большую модель в django, а затем вanguilar, и я не хочу писать все это снова, когда создаю форму. Он также создал поле «auftragposition», которое (проверено в журнале) представляет собой массив с несколькими объектами (auftragposition).Они должны отображаться в таблице матов.Таблица mat является другим подкомпонентом, поэтому я передаю форму следующим образом:

в родительском компоненте (auftragdetail.component.html): 

<app-auftragposition [parentFormGroup]="auftragForm"></app-auftragposition>

в компоненте mat-table(auftragposition.component.ts): 

@Input() parentFormGroup: FormGroup;

в auftragposition.comopnent.html: 

<div class="auftragposition" [formGroup]="parentFormGroup">
    <mat-table class="auftragposition-table mat-elevation-z8" formArrayName="auftragposition" [dataSource]="dataSource"
            matSort matSortActive="position" matSortDirection="desc" matSortDisableClear> [...]

Проблема здесь заключается в источнике данных.Это немного сбивает с толку, потому что поля mat не нуждаются в источниках данных - они заполняются через форму.Я знаю, что могу ввести простой массив в качестве источника данных.Я сделал фиктивный массив, и он показал данные.Но 1) я не могу получить массив из реактивной формы (пробовал много вещей с .get ('') и .value) и 2) я не думаю, что он будет связан с реактивными формами и передаст данныеназад, когда я отправляю ...

Может быть, проблема в как Я создаю свою реактивную форму.Насколько я мог сделать исследование, таблица матов нуждается в формаже, заполненном одной формгруппой в качестве строки.Может быть, способ, которым я просто передаю объект, не создает настоящий formarray.

Я также мог бы найти этот стек, где кто-то написал специальный источник данных (что я должен сделать здесь), но это не такдействительно помогите мне, так как он не заполняется существующими данными в примере: пример Stackblitz

Я был бы благодарен за любые подсказки.

...