html - Ta bort objekt från array typescript(Angular 2)

Jag försöker bara radera ett objekt från en array i TypeScript, i Angular 2.4.0, låt mig visa koden, det är min HTML-fil:

button type="submit" (click)="addAnotherLanguague()" >Add non native languague</button>
<li *ngFor="let languague of listOfLanguagues;">
     <div class="form-item form-item--text">
           <label class="label invisible">Years studied</label>
           <input type="number" min="0" [(ngModel)]="languague.yearsStudied" name="years"  placeholder="Years studied"/>
     </div>
<button type="submit" (click)="removeLanguague(languague)" >Remove</button> // here you can see use of method
</li>

Och där finns component.ts

(...)
this.listOfLanguagues = new Array <LanguagueInformationData>();
    }
addAnotherLanguague(){
        this.listOfLanguagues.push(new LanguagueInformationData);
    }
    removeLanguague(languague){
        this.listOfLanguagues.slice(this.listOfLanguagues.indexOf(languague), 1);
    }
(...)

Att lägga till fungerar bra, men jag har provat allt för att ta bort och vet fortfarande inte hur man överför det språkets referens, jag vill inte använda .pop, för jag vill ta bort exakt det här språket nedan som är knapp. Kan du hjälpa mig?

[redigera] Jag har problem igen med denna kod, för varje gång jag försöker lägga till ett nytt språk (push) raderas mina data i klasser som redan finns i arrayen, vet du vad som kan orsaka det?

Svar #1

<li *ngFor="let languague of listOfLanguagues; let i = index">
<button type="submit" (click)="removeLanguague(languague, i)" >Remove</button>
removeLanguague(languague, index){
    this.listOfLanguagues.splice(index, 1);
}

Svar #2

Du måste använda splice och inte slice

this.listOfLanguagues.splice(this.listOfLanguagues.indexOf(languague), 1);

slice returnerar en del av en array, och splice tar bort element från en array och, om nödvändigt, lägger till nya element på deras plats, och returnerar de borttagna elementen

Relaterade artiklar