Динамически добавлять форму группы в каждом ngtabset

Question

Ситуация

У меня есть общая форма c, которую нужно добавить к каждой новой вкладке, созданной с помощью ngbtabset.following, это HTML и компонент с вкладкой по умолчанию.

Код

В компоненте. html

<ngb-tabset (tabChange)="beforeChange($event)">
    <ngb-tab
      [attr.id]="tab.id"
      *ngFor="let tab of tabs; let i=index;" >

        <ng-template ngbTabTitle>
            <span (click)="onAddTabClick(tab.title)">{{ tab.title }}</span>
            <span
                class="close"
                (click)="onClosiClick(tab, $event)">
                &times;
            </span>
        </ng-template>

        <ng-template ngbTabContent>
            <form [formGroup]="tab.form">
                <div class="form-group col-5">
                    <input type="text" formControlName="tab.form.controls.analysisName" placeholder='Analysis Name' [ngClass]="{ 'is-invalid': submitted && tab.form.controls.analysisName.errors }" />
                    <div *ngIf="submitted && tab.form.controls.analysisName.errors" class="invalid-feedback">
                        <div *ngIf="tab.form.controls.analysisName.errors.required">Analysis Name is required</div>
                    </div>
                </div>
            </form>
        </ng-template>
    </ngb-tab>
</ngb-tabset>

In component.ts

import {
  Component,
  OnInit,
  Output
} from '@angular/core';
import {
  FormBuilder,
  Validators
} from "@angular/forms";
import {
  FormGroup,
  FormControl,
  FormArray
} from '@angular/forms';
import {
  NgbTabChangeEvent
} from '@ng-bootstrap/ng-bootstrap';

export interface ITab {
  id: number;
  title: string;
}

@Component({
  selector: 'app-population',
  templateUrl: './population.component.html',
  styleUrls: ['./population.component.css']
})


export class PopulationComponent implements OnInit {

  private idCounter: number = 1;

  public tabs: ITab[] = [];

  populationFormOne: boolean;
  populationFormTwo: boolean;
  populationFormThree: boolean;
  items: FormArray;

  public newAnalysisFormGroup = this._formBuilder.group({
    analysis: ['', Validators.required],
    analysisName: ['', Validators.required],
    analysisDataSet: ['', Validators.required]
  });
  tabArray = [{
    id: 0,
    title: 'Tab 1 Population',
    form: this.newAnalysisFormGroup
  }, {
    id: 1,
    title: 'Create Tab 2 Population',
    form: {}
  }];

  constructor(private _formBuilder: FormBuilder) {}

  ngOnInit() {
    this.collapseFun();
    this.populationFormOne = true;
    for (var i = 0; i < this.tabArray.length; i++) {
      this.tabArray[i]['form'] = this.newAnalysisFormGroup;
    }
    this.tabs = this.tabs.concat(this.tabArray);
  }

  public onClosiClick(tab: ITab, $event): void {
    this.tabs = this.tabs
      .filter((currentTab: ITab): boolean => currentTab !== tab);

    $event.preventDefault();
  }

  createFormItem(): FormGroup {
    return this._formBuilder.group({
      analysis: ['', Validators.required],
      analysisName: ['', Validators.required],
    });
  }
  public beforeChange($event: NgbTabChangeEvent) {
    this.tabs[1]['title'] = 'Tab 2 Population';
    this.tabs[1]['form'] = this.createFormItem();
  }

  public onAddTabClick(title): void {
    if (title == 'Create Tab 2 Population') {
      this.tabs[1]['title'] = 'Tab 2 Population';
    }
  }

}

Вопрос:

• Я что-то упустил? Цель состоит в том, чтобы добавить форму в каждой вкладке, которая будет привязана к этой вкладке для последующего использования.