El principal problema relacionat amb l'ús de la directiva ngFor amb un índex és que pot donar lloc a resultats inesperats quan les dades que s'iteren canvien. Això es deu al fet que l'índex no s'actualitza automàticament quan s'afegeixen o s'eliminen elements de la matriu, de manera que si s'afegeix un element nou a l'índex 0, tots els altres elements tindran els seus índexs desplaçats un cap avall. Això pot provocar que es mostrin dades incorrectes a la vostra vista o un comportament inesperat a la vostra aplicació.
<ul>
<li *ngFor="let item of items; let i = index">{{i}} - {{item}}</li>
</ul>
1. Aquesta línia de codi crea una llista no ordenada.
2. La directiva *ngFor s'utilitza per recórrer la matriu d'elements i mostrar cada element de la llista.
3. La paraula clau let s'utilitza per declarar una variable anomenada "element" que conté l'element actual en la iteració del bucle.
4. La paraula clau let també s'utilitza per declarar una variable anomenada "i" que conté l'índex de l'element actual en la iteració del bucle.
5. Aquesta línia mostra cada element de la llista amb el seu número d'índex (a partir de 0).
Què és Angular
Angular és un marc d'aplicacions web de codi obert basat en JavaScript, mantingut principalment per Google i per una comunitat de persones i corporacions per abordar molts dels reptes que es troben en el desenvolupament d'aplicacions d'una sola pàgina. Els components JavaScript complementen Apache Cordova, un marc utilitzat per desenvolupar aplicacions mòbils multiplataforma. Té com a objectiu simplificar tant el desenvolupament com la prova d'aquestes aplicacions proporcionant un marc per a arquitectures model-vista-controlador (MVC) i model-vista-model (MVVM) del costat del client, juntament amb components que s'utilitzen habitualment en aplicacions riques d'Internet.
element ngFor
NgFor és una directiva estructural angular que ens permet recórrer dades i crear una plantilla per a cada element d'una matriu o objecte. S'utilitza per repetir un determinat element HTML un nombre determinat de vegades. NgFor es pot utilitzar per mostrar dades d'una matriu, objecte o cadena. També es pot utilitzar per generar elements HTML basats en els valors d'una matriu o objecte. NgFor s'utilitza normalment en combinació amb altres directives angulars com ara ngIf i ngSwitch.
Com obtenir l'índex de l'element ngFor
Podeu utilitzar la paraula clau index per obtenir l'índex d'un element en un bucle ngFor. La sintaxi per a això és la següent:
En aquest exemple, la variable "i" contindrà l'índex actual del bucle. A continuació, podeu utilitzar aquesta variable per accedir o modificar elements de la vostra llista.
