ngFor ಡೈರೆಕ್ಟಿವ್ ಅನ್ನು ಸೂಚ್ಯಂಕದೊಂದಿಗೆ ಬಳಸುವುದಕ್ಕೆ ಸಂಬಂಧಿಸಿದ ಮುಖ್ಯ ಸಮಸ್ಯೆಯೆಂದರೆ, ಡೇಟಾವನ್ನು ಬದಲಾಯಿಸಿದಾಗ ಅದು ಅನಿರೀಕ್ಷಿತ ಫಲಿತಾಂಶಗಳಿಗೆ ಕಾರಣವಾಗಬಹುದು. ಏಕೆಂದರೆ ಸರಣಿಯಿಂದ ಐಟಂಗಳನ್ನು ಸೇರಿಸಿದಾಗ ಅಥವಾ ತೆಗೆದುಹಾಕಿದಾಗ ಸೂಚ್ಯಂಕವು ಸ್ವಯಂಚಾಲಿತವಾಗಿ ಅಪ್‌ಡೇಟ್ ಆಗುವುದಿಲ್ಲ, ಆದ್ದರಿಂದ ಹೊಸ ಐಟಂ ಅನ್ನು ಇಂಡೆಕ್ಸ್ 0 ನಲ್ಲಿ ಸೇರಿಸಿದರೆ, ಇತರ ಎಲ್ಲಾ ಐಟಂಗಳು ಅವುಗಳ ಸೂಚಿಕೆಗಳನ್ನು ಒಂದರಿಂದ ಕೆಳಕ್ಕೆ ವರ್ಗಾಯಿಸುತ್ತವೆ. ಇದು ನಿಮ್ಮ ವೀಕ್ಷಣೆಯಲ್ಲಿ ತಪ್ಪಾದ ಡೇಟಾವನ್ನು ಪ್ರದರ್ಶಿಸಲು ಅಥವಾ ನಿಮ್ಮ ಅಪ್ಲಿಕೇಶನ್‌ನಲ್ಲಿ ಅನಿರೀಕ್ಷಿತ ನಡವಳಿಕೆಗೆ ಕಾರಣವಾಗಬಹುದು.
<ul>
<li *ngFor="let item of items; let i = index">{{i}} - {{item}}</li>
</ul>
1. ಈ ಸಾಲು ಕೋಡ್ ಆದೇಶವಿಲ್ಲದ ಪಟ್ಟಿಯನ್ನು ರಚಿಸುತ್ತದೆ.
2. ಐಟಂಗಳ ರಚನೆಯ ಮೂಲಕ ಲೂಪ್ ಮಾಡಲು ಮತ್ತು ಪಟ್ಟಿಯಲ್ಲಿರುವ ಪ್ರತಿ ಐಟಂ ಅನ್ನು ಪ್ರದರ್ಶಿಸಲು *ngFor ನಿರ್ದೇಶನವನ್ನು ಬಳಸಲಾಗುತ್ತದೆ.
3. ಲೂಪ್ನ ಪುನರಾವರ್ತನೆಯಲ್ಲಿ ಪ್ರಸ್ತುತ ಐಟಂ ಅನ್ನು ಹೊಂದಿರುವ "ಐಟಂ" ಎಂಬ ವೇರಿಯೇಬಲ್ ಅನ್ನು ಘೋಷಿಸಲು ಲೆಟ್ ಕೀವರ್ಡ್ ಅನ್ನು ಬಳಸಲಾಗುತ್ತದೆ.
4. ಲೂಪ್ನ ಪುನರಾವರ್ತನೆಯಲ್ಲಿ ಪ್ರಸ್ತುತ ಐಟಂನ ಸೂಚಿಯನ್ನು ಹೊಂದಿರುವ "i" ಎಂಬ ವೇರಿಯೇಬಲ್ ಅನ್ನು ಘೋಷಿಸಲು ಸಹ ಲೆಟ್ ಕೀವರ್ಡ್ ಅನ್ನು ಬಳಸಲಾಗುತ್ತದೆ.
5. ಈ ಸಾಲು ಪಟ್ಟಿಯಲ್ಲಿರುವ ಪ್ರತಿಯೊಂದು ಐಟಂ ಅನ್ನು ಅದರ ಸೂಚ್ಯಂಕ ಸಂಖ್ಯೆಯೊಂದಿಗೆ ಪ್ರದರ್ಶಿಸುತ್ತದೆ (0 ರಿಂದ ಪ್ರಾರಂಭವಾಗುತ್ತದೆ).
ಕೋನೀಯ ಎಂದರೇನು
ಕೋನೀಯ ಜಾವಾಸ್ಕ್ರಿಪ್ಟ್-ಆಧಾರಿತ ಓಪನ್-ಸೋರ್ಸ್ ಫ್ರಂಟ್-ಎಂಡ್ ವೆಬ್ ಅಪ್ಲಿಕೇಶನ್ ಫ್ರೇಮ್‌ವರ್ಕ್ ಅನ್ನು ಮುಖ್ಯವಾಗಿ ಗೂಗಲ್ ಮತ್ತು ವ್ಯಕ್ತಿಗಳು ಮತ್ತು ಕಾರ್ಪೊರೇಷನ್‌ಗಳ ಸಮುದಾಯವು ಏಕ-ಪುಟ ಅಪ್ಲಿಕೇಶನ್‌ಗಳನ್ನು ಅಭಿವೃದ್ಧಿಪಡಿಸುವಲ್ಲಿ ಎದುರಿಸುತ್ತಿರುವ ಅನೇಕ ಸವಾಲುಗಳನ್ನು ಪರಿಹರಿಸಲು ನಿರ್ವಹಿಸುತ್ತದೆ. ಜಾವಾಸ್ಕ್ರಿಪ್ಟ್ ಘಟಕಗಳು ಅಪಾಚೆ ಕಾರ್ಡೋವಾಗೆ ಪೂರಕವಾಗಿದೆ, ಇದು ಕ್ರಾಸ್-ಪ್ಲಾಟ್‌ಫಾರ್ಮ್ ಮೊಬೈಲ್ ಅಪ್ಲಿಕೇಶನ್‌ಗಳನ್ನು ಅಭಿವೃದ್ಧಿಪಡಿಸಲು ಬಳಸುವ ಚೌಕಟ್ಟಾಗಿದೆ. ಕ್ಲೈಂಟ್-ಸೈಡ್ ಮಾಡೆಲ್-ವ್ಯೂ-ನಿಯಂತ್ರಕ (MVC) ಮತ್ತು ಮಾದರಿ-ವೀಕ್ಷಣೆ-ವೀಕ್ಷಣೆ ಮಾದರಿ (MVVM) ಆರ್ಕಿಟೆಕ್ಚರ್‌ಗಳಿಗೆ ಚೌಕಟ್ಟನ್ನು ಒದಗಿಸುವ ಮೂಲಕ ಅಂತಹ ಅಪ್ಲಿಕೇಶನ್‌ಗಳ ಅಭಿವೃದ್ಧಿ ಮತ್ತು ಪರೀಕ್ಷೆ ಎರಡನ್ನೂ ಸರಳಗೊಳಿಸುವ ಗುರಿಯನ್ನು ಹೊಂದಿದೆ, ಜೊತೆಗೆ ಶ್ರೀಮಂತ ಇಂಟರ್ನೆಟ್ ಅಪ್ಲಿಕೇಶನ್‌ಗಳಲ್ಲಿ ಸಾಮಾನ್ಯವಾಗಿ ಬಳಸುವ ಘಟಕಗಳು.
ng ಅಂಶಕ್ಕಾಗಿ
NgFor ಎಂಬುದು ಕೋನೀಯ ರಚನಾತ್ಮಕ ನಿರ್ದೇಶನವಾಗಿದ್ದು ಅದು ನಮಗೆ ಡೇಟಾದ ಮೂಲಕ ಲೂಪ್ ಮಾಡಲು ಮತ್ತು ರಚನೆ ಅಥವಾ ವಸ್ತುವಿನಲ್ಲಿ ಪ್ರತಿ ಐಟಂಗೆ ಟೆಂಪ್ಲೇಟ್ ರಚಿಸಲು ಅನುಮತಿಸುತ್ತದೆ. ನೀಡಿದ HTML ಅಂಶವನ್ನು ನಿರ್ದಿಷ್ಟ ಸಂಖ್ಯೆಯ ಬಾರಿ ಪುನರಾವರ್ತಿಸಲು ಇದನ್ನು ಬಳಸಲಾಗುತ್ತದೆ. ಅರೇ, ಆಬ್ಜೆಕ್ಟ್ ಅಥವಾ ಸ್ಟ್ರಿಂಗ್‌ನಿಂದ ಡೇಟಾವನ್ನು ಪ್ರದರ್ಶಿಸಲು NgFor ಅನ್ನು ಬಳಸಬಹುದು. ರಚನೆಯ ಅಥವಾ ವಸ್ತುವಿನ ಮೌಲ್ಯಗಳ ಆಧಾರದ ಮೇಲೆ HTML ಅಂಶಗಳನ್ನು ರಚಿಸಲು ಇದನ್ನು ಬಳಸಬಹುದು. NgFor ಅನ್ನು ಸಾಮಾನ್ಯವಾಗಿ ngIf ಮತ್ತು ngSwitch ನಂತಹ ಇತರ ಕೋನೀಯ ನಿರ್ದೇಶನಗಳೊಂದಿಗೆ ಸಂಯೋಜನೆಯಲ್ಲಿ ಬಳಸಲಾಗುತ್ತದೆ.
ngFor ಅಂಶದ ಸೂಚಿಯನ್ನು ಹೇಗೆ ಪಡೆಯುವುದು
ngFor ಲೂಪ್‌ನಲ್ಲಿ ಅಂಶದ ಸೂಚಿಯನ್ನು ಪಡೆಯಲು ನೀವು ಸೂಚ್ಯಂಕ ಕೀವರ್ಡ್ ಅನ್ನು ಬಳಸಬಹುದು. ಇದಕ್ಕಾಗಿ ಸಿಂಟ್ಯಾಕ್ಸ್ ಈ ಕೆಳಗಿನಂತಿರುತ್ತದೆ:
ಈ ಉದಾಹರಣೆಯಲ್ಲಿ, "i" ವೇರಿಯೇಬಲ್ ಲೂಪ್ನ ಪ್ರಸ್ತುತ ಸೂಚ್ಯಂಕವನ್ನು ಹೊಂದಿರುತ್ತದೆ. ನಂತರ ನಿಮ್ಮ ಪಟ್ಟಿಯಲ್ಲಿರುವ ಅಂಶಗಳನ್ನು ಪ್ರವೇಶಿಸಲು ಅಥವಾ ಮಾರ್ಪಡಿಸಲು ನೀವು ಈ ವೇರಿಯೇಬಲ್ ಅನ್ನು ಬಳಸಬಹುದು.
