web-dev-qa-db-fra.com

Supprimer un objet du tableau TypeScript (Angular 2)

J'essaie juste de supprimer un objet du tableau en TypeScript, dans angular 2.4.0, permettez-moi de montrer le code, son mon fichier html:

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>

Et il y a component.ts

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

L'ajout fonctionne bien, mais j'ai tout essayé pour supprimer et je ne sais toujours pas comment transférer la référence de cette langue, je ne veux pas utiliser .pop, car je veux supprimer exactement cette langue en dessous du bouton. Pouvez-vous m'aider?

[edit] J'ai de nouveau un problème avec ce code, car chaque fois que j'essaye d'ajouter une nouvelle langue (Push) il efface mes données sur les classes existantes dans le tableau, savez-vous ce qui peut en être la cause?

htmlangulartypescriptngfor
6
Jędrek Markowski

<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);
}
21
elzoy

Vous devez utiliser splice et non slice

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

slice renvoie une section d'un tableau et splice supprime des éléments d'un tableau et, si nécessaire, insère de nouveaux éléments à leur place, renvoyant les éléments supprimés

11
PierreDuc