Typschrift. FormGroup-FormularArray - Entfernt nur ein Elementobjekt nach Wert. Winkel 2 4

Question

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

ich hinzufügen neues Element auf diese Weise: this.images.push(new FormControl(new ImageCreateForm(this.imageResponse.id)));

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

Meine Klassen:

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

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

Wenn ich Bilder hinzugefügt, dann meine {{ formGroup.value | json }} ist:

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

Ich möchte Bilder entfernen (zum Beispiel nur Bild mit id=502) von formGroup vor, wenn ich meine Formular-POST-Anfrage sende. Ist es möglich? Ich versuchte Verwendung reset Methode, aber das entfernen alle Elemente: this.images.reset({"id":image.id});. Wo image ist es ein ImageResponse Objekt.

Ergebnis: {"images": [ null, null, null ]}, aber ich will:

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

Answer 1

FormArray Klasse removeAt hat, die den Index nimmt. Wenn Sie den Index nicht kennen, können Sie eine Problemumgehung durchführen:

this.images.removeAt(this.images.value.findIndex(image => image.id === 502))