pu sh сформировать групповые значения для формирования массива без повторяющихся полей в html

Question

Я хочу, чтобы значения группы pu sh формировались в массив, но поля формы не должны повторяться

всякий раз, когда я нажимаю на поля формы отправки, не должно повторяться, но значения формы должны быть sh в массив как объекты ...

  <div formArrayName="arr" *ngFor="let a of myForm.get('arr').controls; let i = index">
    <div [formGroupName]="i" style="margin-bottom: 10px;">
      <label for="name">Name:</label>
      <input type="text" name="name" formControlName="name">
      <br><br>
      <label for="pay">Pay:</label>
      <input type="text" name="pay" formControlName="pay">
    </div>
  </div>
  <br>
  <button type="button" (click)="addItem()" style="margin-right: 5px;">Add</button>
  <button type="submit">Submit</button>
</form>`



.ts
  name = 'Angular';
  myForm: FormGroup;
  arr: FormArray;

  constructor(private fb: FormBuilder) { }

  ngOnInit() {
    this.myForm = this.fb.group({
      arr: this.fb.array([this.createItem()])
    })
  }

  createItem() {
    return this.fb.group({
      name: [''],
      pay: ['']
    })
  }

  addItem() {
    this.arr = this.myForm.get('arr') as FormArray;
    this.arr.push(this.createItem());
  }

  onSubmit() {    
    console.log(this.myForm.value);
  }```