தீர்க்கப்பட்டது: குறியீட்டுடன் html ngfor

ஒரு குறியீட்டுடன் ngFor கட்டளையைப் பயன்படுத்துவதில் உள்ள முக்கிய பிரச்சனை என்னவென்றால், தரவு மாறும்போது அது எதிர்பாராத முடிவுகளுக்கு வழிவகுக்கும். ஏனெனில், வரிசையிலிருந்து உருப்படிகள் சேர்க்கப்படும்போது அல்லது அகற்றப்படும்போது, ​​குறியீடு தானாகவே புதுப்பிக்கப்படாது, எனவே குறியீட்டு 0 இல் ஒரு புதிய உருப்படி சேர்க்கப்பட்டால், மற்ற எல்லா உருப்படிகளும் அவற்றின் குறியீடுகள் ஒன்றால் கீழே மாற்றப்படும். இது உங்கள் பார்வையில் தவறான தரவு அல்லது உங்கள் பயன்பாட்டில் எதிர்பாராத நடத்தைக்கு வழிவகுக்கும்.

<ul>
  <li *ngFor="let item of items; let i = index">{{i}} - {{item}}</li>
</ul>

1. இந்த வரிக் குறியீடு வரிசைப்படுத்தப்படாத பட்டியலை உருவாக்குகிறது.
2. உருப்படிகளின் வரிசையின் மூலம் லூப் செய்து பட்டியலில் உள்ள ஒவ்வொரு உருப்படியையும் காட்ட *ngFor உத்தரவு பயன்படுத்தப்படுகிறது.
3. லூப்பின் மறு செய்கையில் தற்போதைய உருப்படியை வைத்திருக்கும் “உருப்படி” எனப்படும் மாறியை அறிவிக்க விடு முக்கிய வார்த்தை பயன்படுத்தப்படுகிறது.
4. லூப்பின் மறு செய்கையில் தற்போதைய உருப்படியின் குறியீட்டை வைத்திருக்கும் “i” எனப்படும் மாறியை அறிவிக்கவும் விடு முக்கிய வார்த்தை பயன்படுத்தப்படுகிறது.
5. இந்த வரி பட்டியலில் உள்ள ஒவ்வொரு பொருளையும் அதன் குறியீட்டு எண்ணுடன் (0 இலிருந்து தொடங்குகிறது) காட்டுகிறது.

கோணல் என்றால் என்ன

Angular என்பது ஜாவாஸ்கிரிப்ட் அடிப்படையிலான திறந்த-மூல முன்-இறுதி வலை பயன்பாட்டு கட்டமைப்பாகும், இது முக்கியமாக கூகிள் மற்றும் தனிநபர்கள் மற்றும் நிறுவனங்களின் சமூகத்தால் ஒரு பக்க பயன்பாடுகளை உருவாக்குவதில் எதிர்கொள்ளும் பல சவால்களை எதிர்கொள்ளும். ஜாவாஸ்கிரிப்ட் கூறுகள் அப்பாச்சி கோர்டோவாவை நிரப்புகின்றன, இது குறுக்கு-தளம் மொபைல் பயன்பாடுகளை உருவாக்க பயன்படுகிறது. கிளையன்ட்-சைட் மாடல்-வியூ-கண்ட்ரோலர் (எம்விசி) மற்றும் மாடல்-வியூ-வியூமாடல் (எம்விவிஎம்) கட்டமைப்புகளுக்கான கட்டமைப்பை வழங்குவதன் மூலம் இதுபோன்ற பயன்பாடுகளின் மேம்பாடு மற்றும் சோதனை இரண்டையும் எளிதாக்குவதை இது நோக்கமாகக் கொண்டுள்ளது, மேலும் பணக்கார இணையப் பயன்பாடுகளில் பொதுவாகப் பயன்படுத்தப்படும் கூறுகளுடன்.

ng உறுப்புக்காக

NgFor என்பது ஒரு கோணக் கட்டமைப்பு உத்தரவு ஆகும், இது தரவு மூலம் லூப் செய்ய மற்றும் ஒரு வரிசை அல்லது பொருளில் உள்ள ஒவ்வொரு உருப்படிக்கும் ஒரு டெம்ப்ளேட்டை உருவாக்க அனுமதிக்கிறது. கொடுக்கப்பட்ட HTML உறுப்பை ஒரு குறிப்பிட்ட எண்ணிக்கையில் மீண்டும் செய்ய இது பயன்படுகிறது. வரிசை, பொருள் அல்லது சரத்திலிருந்து தரவைக் காட்ட NgFor பயன்படுத்தப்படலாம். வரிசை அல்லது பொருளின் மதிப்புகளின் அடிப்படையில் HTML கூறுகளை உருவாக்கவும் இது பயன்படுத்தப்படலாம். NgFor பொதுவாக ngIf மற்றும் ngSwitch போன்ற பிற கோண உத்தரவுகளுடன் இணைந்து பயன்படுத்தப்படுகிறது.

ngFor உறுப்புக்கான குறியீட்டை எவ்வாறு பெறுவது

ngFor லூப்பில் உள்ள உறுப்பின் குறியீட்டைப் பெற, குறியீட்டுச் சொல்லைப் பயன்படுத்தலாம். இதற்கான தொடரியல் பின்வருமாறு:

{{i}} – {{item}}

இந்த எடுத்துக்காட்டில், "i" மாறியானது லூப்பின் தற்போதைய குறியீட்டைக் கொண்டிருக்கும். உங்கள் பட்டியலில் உள்ள உறுப்புகளை அணுக அல்லது மாற்ற இந்த மாறியைப் பயன்படுத்தலாம்.

தொடர்புடைய இடுகைகள்:

ஒரு கருத்துரையை