Многошаговая генерация форм с динамическими полями из API

Question

Я получаю ответ, аналогичный этому, из API GraphQL:

{
    metrics: [
         0: {
             metric: { id: 1, name: 'xMetric', category: { id: 1, name: 'xCat'}},
             room: { id: 1, name: 'xRoom'}
         },
    ... // It continues with metric objects
    ],
    checks: [
        0: {
             checks: { id: 1, name: 'xCheck', category: { id: 1, name: 'xCat'}},
             room: { id: 1, name: 'xRoom'}
         },
    ... // It continues with checks
    ]

}

Мне нужно сгенерировать поля формы для каждой комнаты, и каждая комната будет содержать несколько категорий.

То, что я сделал, я сгруппировал по комнатам, затем отфильтровал массив комнат, чтобы они не содержали дубликатов с lodash, и сделал то же самое с категориями каждой комнаты. Затем я сгенерировал поля каждой категории, в которые пользователь должен будет записать ввод, чтобы мы могли сохранить его позже.

Мне нужно сгенерировать несколько форм на основе количества комнат, а затем несколько категорий на основе комнаты и несколько полей на основе этих категорий.

Это шаблон, которому я следовал: https://material.angular.io/components/stepper/examples.

Но то, что я не могу заставить работать, это правильно генерировать количество форм.

Вот как я динамически генерирую форму с несколькими динамическими полями:

this.ourXParameters$.subscribe(params => {
            this.siteSubsystems = _.map(params, subsystem => subsystem.name);
            _.forEach(siteParametersPerSubsystem, subsystem => {
                const group = this.formBuilder.group({});
                _.forEach(subsystem.parameters, parameter => {
                    const control = this.formBuilder.control(null, parameter.mandatory ? Validators.required : null);
                    // add control in the control group of the form and keep an index via parameter id (east access later)
                    group.addControl(`parameter_${parameter.id}`, control);
                    _.set(this._controlsPerParameterId, parameter.id, control);
                });
                (<FormArray>this.xForm.controls['subsystems']).push(group);
            });
        });

В моем случае это не работает, потому что у меня нет только одной формы, но в зависимости от количества комнат у меня может быть несколько форм, и у меня также не определено имя элемента управления.