TypeScript. FormGroup FormArray - elimină doar un singur obiect element după valoare. Angular 2 4

this.formGroup = this.formBuilder.group({
    images: this.fb.array([])
});

Adaug un element nou în acest mod: this.images.push(new FormControl(new ImageCreateForm(this.imageResponse.id)));

get images(): FormArray {
    return <FormArray>this.formGroup.controls.images;
}

Cursurile mele:

export class ImageCreateForm {
    id: number;
    constructor(id: number) {
        this.id = id;
    }
}

export class ImageResponse {
    id: number;
    url: string;
}

Când am adăugat imagini, atunci {{ formGroup.value | json }} este:

"images": [
   {
    "id": 501
   },
   {
    "id": 502
   },
   {
    "id": 503
   }
]

Vreau să elimin imaginile (de exemplu doar imaginea cu id=502) din formGroup înainte de a trimite cererea mea POST a formularului. Este posibil? Am încercat să folosesc metoda reset, dar aceasta elimină toate elementele: this.images.reset({"id":image.id});. Unde image este un obiect ImageResponse.

Rezultat: {"images": [ null, null, null ]}, dar eu vreau:

"images": [
   {
    "id": 501
   },
   {
    "id": 503
   }
]

Răspuns #1

Clasa FormArray are removeAt care ia indexul. Dacă nu cunoști indexul, poți face o soluție alternativă:

// findIndex returns -1 if not found
// `removeAt` wraps around from the back if given negative
const index = this.images.value.findIndex(image => image.id === 502)
if(index !== -1) this.images.removeAt(index)

Răspunsul #2

În Angular Reactive Forms, formArray are o metodă numită removeAt(). O poți folosi trecând un index pe care vrei să îl ștergi:

delete(index){
    this.array.removeAt(index)
}
``