Glavni problem povezan s korištenjem direktive ngFor s indeksom je taj što može dovesti do neočekivanih rezultata kada se podaci koji se ponavljaju mijenjaju. To je zato što se indeks ne ažurira automatski kada se stavke dodaju ili uklone iz niza, pa ako se nova stavka doda na indeksu 0, indeksi svih ostalih stavki bit će pomaknuti za jedan prema dolje. To može dovesti do netočnih podataka koji se prikazuju u vašem prikazu ili neočekivanog ponašanja u vašoj aplikaciji.
<ul>
<li *ngFor="let item of items; let i = index">{{i}} - {{item}}</li>
</ul>
1. Ovaj redak koda stvara neuređeni popis.
2. Direktiva *ngFor koristi se za prolazak kroz niz stavki i prikaz svake stavke na popisu.
3. Ključna riječ let koristi se za deklariranje varijable pod nazivom "item" koja drži trenutnu stavku u iteraciji petlje.
4. Ključna riječ let također se koristi za deklariranje varijable pod nazivom "i" koja drži indeks trenutne stavke u iteraciji petlje.
5. Ovaj redak prikazuje svaku stavku na popisu sa svojim indeksnim brojem (počevši od 0).
Što je Angular
Angular je okvir otvorene web-aplikacije otvorenog koda koji se uglavnom održava od strane Googlea i zajednice pojedinaca i korporacija za rješavanje mnogih izazova s kojima se susreću u razvoju jednostraničkih aplikacija. Komponente JavaScripta nadopunjuju Apache Cordovu, okvir koji se koristi za razvoj mobilnih aplikacija za više platformi. Cilj mu je pojednostaviti i razvoj i testiranje takvih aplikacija pružanjem okvira za arhitekturu model-pogled-kontroler (MVC) i model-pogled-model (MVVM) na strani klijenta, zajedno s komponentama koje se obično koriste u bogatim internetskim aplikacijama.
ngZa element
NgFor je Angular strukturna direktiva koja nam omogućuje kruženje kroz podatke i stvaranje predloška za svaku stavku u nizu ili objektu. Koristi se za ponavljanje određenog HTML elementa određeni broj puta. NgFor se može koristiti za prikaz podataka iz polja, objekta ili niza. Također se može koristiti za generiranje HTML elemenata na temelju vrijednosti polja ili objekta. NgFor se obično koristi u kombinaciji s drugim Angular direktivama kao što su ngIf i ngSwitch.
Kako dobiti indeks elementa ngFor
Možete koristiti ključnu riječ index da dobijete indeks elementa u ngFor petlji. Sintaksa za ovo je sljedeća:
U ovom primjeru, varijabla "i" sadržavat će trenutni indeks petlje. Zatim možete koristiti ovu varijablu za pristup ili izmjenu elemenata na vašem popisu.
