Angular: добавление сложных ControlValueAccessors в FormGroup, не устанавливая их в нуль

Question

У меня возникла проблема, связанная с FormGroups и ControlValueAccessors .

Я создал компонент root Editor , содержащий FormGroup . Внутри него есть некоторые другие компоненты, все они сделаны из нескольких FormGroups , FormArrays и FormControl . Довольно вложенная структура. Все они также реализуют интерфейс ControlValueAccessor .

Итак, мой root шаблон компонента выглядит следующим образом:

editor.component. html

<form [formGroup]="editorForm" (ngSubmit)="onSubmit()">
    <app-section-tax-payer-data formControlName="taxPayerData"></app-section-tax-payer-data>
    <app-section-regions formControlName="regions"></app-section-regions>
    <app-section-other-entities formControlName="others"></app-section-other-entities>
</form>

Внешний вид контроллера редактора вот так:

editor.component.ts

export class EditorComponent implements OnInit {
editorForm = this.fb.group({
    taxPayerData: null,
    regions: null,
    others: null
});

Компоненты выглядят так:

section-region.component.ts

export class SectionRegionsComponent implements OnInit, ControlValueAccessor {
    regionsFormGroup = this.fb.group({
        rows: this.fb.array([]),
        creditSum: { value: null },
        debtSum: { value: null },
        balance: { value: null }
    });

    constructor(private fb: FormBuilder) {
        this.rows.forEach((i) => {
            // Create form controls for each row
            this.rowsFormArray.push(this.fb.group({
                regionCode: null,
                tributeCode: null,
                instalment: null,
                referenceYear: [null, { validators: [Validators.pattern("^[0-9]*$")] }],
                debtAmount: [null, { validators: [Validators.pattern("^[0-9]*$")] }],
                creditAmount: [null, { validators: [Validators.pattern("^[0-9]*$")] }],
            }))
        }
    }

Моя проблема заключается в следующем: если я добавлю другие FormControls в editorForm таким образом, я установлю для них значение null, потеряв их внутреннюю структуру (FormArray, содержащий FormGroups, содержащие FormControls).

Есть ли способ получить их и сказать Angular использовать их "как они есть"? Каждый компонент уже инициализирует свою внутреннюю структуру, я не понимаю, почему мне нужно указывать значение при добавлении FormControl.

Спасибо за помощь, я только начал использовать Angular (из Angular JS) и я как бы потерялся здесь!