हल: सूचकांक के साथ 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 से शुरू) के साथ प्रदर्शित करती है।

कोणीय क्या है

कोणीय एक जावास्क्रिप्ट-आधारित ओपन-सोर्स फ्रंट-एंड वेब एप्लिकेशन फ्रेमवर्क है जो मुख्य रूप से Google और व्यक्तियों और निगमों के एक समुदाय द्वारा बनाए रखा जाता है ताकि सिंगल-पेज एप्लिकेशन विकसित करने में आने वाली कई चुनौतियों का समाधान किया जा सके। JavaScript घटक Apache Cordova के पूरक हैं, क्रॉस-प्लेटफ़ॉर्म मोबाइल ऐप्स विकसित करने के लिए उपयोग किया जाने वाला एक ढाँचा। इसका उद्देश्य क्लाइंट-साइड मॉडल-व्यू-कंट्रोलर (एमवीसी) और मॉडल-व्यू-व्यूमॉडल (एमवीवीएम) आर्किटेक्चर के साथ-साथ समृद्ध इंटरनेट अनुप्रयोगों में आमतौर पर उपयोग किए जाने वाले घटकों के लिए एक रूपरेखा प्रदान करके ऐसे अनुप्रयोगों के विकास और परीक्षण दोनों को सरल बनाना है।

एनजी तत्व के लिए

NgFor एक कोणीय संरचनात्मक निर्देश है जो हमें डेटा के माध्यम से लूप करने और सरणी या ऑब्जेक्ट में प्रत्येक आइटम के लिए एक टेम्पलेट बनाने की अनुमति देता है। इसका उपयोग किसी दिए गए HTML तत्व को निर्दिष्ट संख्या में दोहराने के लिए किया जाता है। NgFor का उपयोग किसी सरणी, ऑब्जेक्ट या स्ट्रिंग से डेटा प्रदर्शित करने के लिए किया जा सकता है। इसका उपयोग किसी सरणी या वस्तु के मूल्यों के आधार पर HTML तत्वों को उत्पन्न करने के लिए भी किया जा सकता है। NgFor का उपयोग आमतौर पर अन्य कोणीय निर्देशों जैसे ngIf और ngSwitch के संयोजन में किया जाता है।

कैसे ngFor तत्व की अनुक्रमणिका प्राप्त करने के लिए

आप ngFor लूप में किसी तत्व की अनुक्रमणिका प्राप्त करने के लिए index कीवर्ड का उपयोग कर सकते हैं। इसके लिए सिंटैक्स इस प्रकार है:

{{i}} – {{item}}

इस उदाहरण में, "i" चर में लूप की वर्तमान अनुक्रमणिका होगी। फिर आप अपनी सूची में तत्वों तक पहुँचने या संशोधित करने के लिए इस चर का उपयोग कर सकते हैं।

संबंधित पोस्ट:

एक टिप्पणी छोड़ दो