I am unable to get values from FormArray in Angular6

Question

I am unable to get the form array data. Here i am using two fields in one form group and one form array. Now i want to fetch all data from both form group and form array. Suggest a solution to get rid of this error

Here is my .ts code

import { Component, OnInit } from '@angular/core';
import { FormGroup, FormBuilder, Validators, FormArray } from 
'@angular/forms';
@Component({
  selector: 'app-basic-forms',
  templateUrl: './basic-forms.component.html',
  styleUrls: ['./basic-forms.component.css']
})
export class BasicFormsComponent implements OnInit {
  registerForm: FormGroup;
  constructor(private formBuilder: FormBuilder) { }
  ngOnInit() {
    this.registerForm = this.formBuilder.group({
      firstName: ['', Validators.required],
      lastName: ['', Validators.required],
      aliases: this.formBuilder.array([])
    });
  }
  get aliases() {
    return this.registerForm.get('aliases') as FormArray;
  }
  addAlias() {
    this.aliases.push(this.formBuilder.group({
      Name: [''],
      Age: ['']
    }));
  }
  onSubmit() {
    alert(Success!!\n\n ${JSON.stringify(this.registerForm.value)});
  }
}

Html code :

<form [formGroup]="registerForm" (ngSubmit)="onSubmit()">
  <div class="form-row">
     <div class="col">
        <label>First Name</label>
        <input type="text" class="form-control" placeholder="First name" formControlName="firstName" />
     </div>
     <div class="col">
       <label>Last Name</label>
       <input type="text" class="form-control" placeholder="Last name" formControlName="lastName" />
     </div>
  </div>
  <br>
  <div class="form-row">
        <div formArrayName="aliases">
          <button class="btn btn-info btn-sm" (click)="addAlias()">Add</button>
          <div *ngFor="let address of registerForm.controls.aliases.controls; let i=index">
            <div formGroupName="i">
                Name : <input type="text" class="form-control" formControlName = "Name" />
                Age : <input type="text" class="form-control" formControlName = "Age" />
            </div>
          </div>
        </div>
      </div>
      <br>
      <button type="submit" class="btn btn-primary">Submit</button>
</form>

Output

Answer 1

Just change formGroupName="i" to [formGroupName]="i"