Angular - Remove FormGroup from FormArray in forEach loop based on matching criteria

Question

I have below code

    (this.formGroups.get('items') as FormArray).controls.forEach((item, index, object) => {
        console.log(item.value.attributeDisplayName);
        if (item.value.attributeDisplayName === '') {
            object.splice(index, 1);
        }
    });

I am not sure whether the code is correct or not, however it is not getting executed. Basically I need to remove all the object(s)/formGroup(s) from my formGroups array where attributeDisplayName is empty.

item.value gives me the current object with properties where attributeDisplayName resides. Please suggest. Thanks.

vaira · Accepted Answer · 2021-12-17 08:33:15Z

3

'removeAt' is the proper way of removing single object/control from a FormArray, but if you use it with multiple controls in loop it results in removing some but not others.

This might be happening due to removing from the same index you are looping over, to overcome this you can first identify the unwanted controls and then remove them in reverse.

Stackblitz example

deleteEmpty() {
let indexToRemove: number[] = [];

let fromArray = this.form.get('items') as FormArray;
fromArray.controls.forEach((control, index) => {
  if (!control.value.attributeDisplayName) {
    indexToRemove.push(index);
  }
});
indexToRemove.reverse().forEach((index) => {
  fromArray.removeAt(index);
});

}

edited Dec 17, 2021 at 8:33

answered Dec 17, 2021 at 5:29

vaira

2,2801 gold badge13 silver badges16 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

jagjeet · Accepted Answer · 2023-08-18 05:46:24Z

0

This is going to clear your whole formarray.

this.form.get('images')['controls'].splice(0,this.form.get('images')['controls'].length);

answered Aug 18, 2023 at 5:46

jagjeet

3774 silver badges13 bronze badges

Collectives™ on Stack Overflow

Angular - Remove FormGroup from FormArray in forEach loop based on matching criteria

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related