FormArray return null?

Alex, you has an Form Array of FormControls, not an Form Array of formGroups. So you .html must be like

<form *ngIf="addForm" [formGroup]="addForm">
    <div class="form-control-row" formArrayName="email"
        *ngFor="let item of addForm.get('email').controls; let i = index;">
        <div class="input-box">
            <input type="text" placeholder="E - mail" [formControlName]="i">
            <img src="../../assets/Delete.svg" alt="x-icon">
      </div>
        </div>
</form>

See that you has no [fomGroupName]="i", and you use [formControlName]="i"

Other way is

<form *ngIf="addForm" [formGroup]="addForm">
    <div class="form-control-row" formArrayName="email"
        *ngFor="let item of addForm.get('email').controls; let i = index;">
        <div class="input-box">
            <input type="text" placeholder="E - mail" [formControl]="item">
            <img src="../../assets/Delete.svg" alt="x-icon">
      </div>
        </div>
</form>

See that in this case we use [formControl]="item" (item is the variable you use in the *ngFor)

Well, how you create the formArray?

If you has an array of emails you can do

    email:  this.formBuilder.array(
             this.email.map(x=>this.formBuilder.control(x))
          )

That's you create an array of FormControls using map (transform each element of the array in a FormControl who value the element of the array.

NOTE: In production you need create a getter for the array

get emails()
{
    return this.form.get('email') as FormArray;
}

And iterate over

    *ngFor="let item of emails.controls; let i = index;">

The use of [formGroupName]="i" and formControl it's used with a FormArray of FormGroups. e.g. you can has

    email:  this.formBuilder.array(
             this.email.map(x=>this.formBuilder.group({email:x}))
          )

See that in this case transform each element of the array in a formGroup that has a FormControl "called" email

You can see all this in this stackblitz. I hope the example help you understand the diference

If we want to add an element to the formArray we can make a function

  addEmail(email:any)
  {
    const array=this.addForm.get('email') as FormArray 
    array.push(this.formBuilder.control(email)) //if is a FormArray of FormControl

    const array2=this.addForm.get('email2') as FormArray
    array2.push(this.formBuilder.group({email:email})) //if is a FormArray of FormGroup
  }

NOTE: At first, if we want to create a empty formArray we need use

    email:  this.formBuilder.array([])

When we want delete an element of the array, we need pass the "index" of the array, so our function delete is

delete(index:number)
  {
    const array=this.addForm.get('email') as FormArray
    array.removeAt(index)

  }

and our .html is

  <div class="input-box">
        <input type="text" placeholder="E - mail" [formControl]="item">
        <img src="../../assets/Delete.svg" alt="x-icon" (click)="delete(i)">
  </div>