Galvenā problēma, kas saistīta ar ngFor direktīvas izmantošanu ar indeksu, ir tā, ka tā var novest pie negaidītiem rezultātiem, kad mainās dati, kas tiek atkārtoti. Tas ir tāpēc, ka indekss netiek automātiski atjaunināts, kad vienumi tiek pievienoti vai izņemti no masīva, tādēļ, ja indeksā 0 tiek pievienots jauns vienums, visu pārējo vienumu indeksi tiks nobīdīti par vienu uz leju. Tas var novest pie nepareizu datu parādīšanas jūsu skatā vai neparedzētas darbības jūsu lietojumprogrammā.
<ul>
<li *ngFor="let item of items; let i = index">{{i}} - {{item}}</li>
</ul>
1. Šī koda rinda izveido nesakārtotu sarakstu.
2. Direktīva *ngFor tiek izmantota, lai pārvietotos pa vienumu masīvu un parādītu katru saraksta vienumu.
3. Atslēgvārdu let izmanto, lai deklarētu mainīgo ar nosaukumu “item”, kas satur pašreizējo vienumu cilpas iterācijā.
4. Atslēgvārdu let izmanto arī, lai deklarētu mainīgo ar nosaukumu “i”, kas satur pašreizējā vienuma indeksu cilpas atkārtojumā.
5. Šajā rindā tiek parādīts katrs saraksta vienums ar tā indeksa numuru (sākot no 0).
Kas ir Angular
Angular ir uz JavaScript balstīta atvērtā pirmkoda priekšgala tīmekļa lietojumprogrammu ietvars, ko galvenokārt uztur Google un privātpersonu un korporāciju kopiena, lai risinātu daudzas problēmas, ar kurām saskaras vienas lapas lietojumprogrammu izstrāde. JavaScript komponenti papildina Apache Cordova — sistēmu, ko izmanto starpplatformu mobilo lietotņu izstrādei. Tā mērķis ir vienkāršot gan šādu lietojumprogrammu izstrādi, gan testēšanu, nodrošinot ietvaru klienta puses modeļa–skata–kontrollera (MVC) un modeļa–skata–skata modeļa (MVVM) arhitektūrām, kā arī komponentus, ko parasti izmanto bagātīgās interneta lietojumprogrammās.
ngElementam
NgFor ir leņķiskā strukturālā direktīva, kas ļauj mums cilpot datus un izveidot veidni katram masīva vai objekta vienumam. To izmanto, lai noteiktu HTML elementu atkārtotu noteiktu skaitu reižu. NgFor var izmantot, lai parādītu datus no masīva, objekta vai virknes. To var izmantot arī, lai ģenerētu HTML elementus, pamatojoties uz masīva vai objekta vērtībām. NgFor parasti tiek izmantots kopā ar citām Angular direktīvām, piemēram, ngIf un ngSwitch.
Kā iegūt ngFor elementa indeksu
Varat izmantot indeksa atslēgvārdu, lai iegūtu ngFor cilpas elementa indeksu. Sintakse tam ir šāda:
Šajā piemērā mainīgais “i” saturēs pašreizējo cilpas indeksu. Pēc tam varat izmantot šo mainīgo, lai piekļūtu saraksta elementiem vai mainītu tos.
