सोडवले: html ngfor index सह

निर्देशांकासह ngFor निर्देश वापरण्याशी संबंधित मुख्य समस्या ही आहे की डेटा बदलल्यावर पुनरावृत्ती केल्यावर अनपेक्षित परिणाम होऊ शकतात. कारण अॅरेमधून आयटम जोडले जातात किंवा काढले जातात तेव्हा अनुक्रमणिका आपोआप अपडेट होत नाही, त्यामुळे अनुक्रमणिका 0 वर नवीन आयटम जोडल्यास, इतर सर्व आयटमची अनुक्रमणिका एक-एक करून खाली हलवली जाईल. यामुळे तुमच्या दृश्यात चुकीचा डेटा प्रदर्शित होऊ शकतो किंवा तुमच्या अनुप्रयोगात अनपेक्षित वर्तन होऊ शकते.

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

1. कोडची ही ओळ अक्रमित सूची तयार करते.
2. *ngFor निर्देशाचा वापर आयटम अॅरेमधून लूप करण्यासाठी आणि सूचीमधील प्रत्येक आयटम प्रदर्शित करण्यासाठी केला जातो.
3. लूपच्या पुनरावृत्तीमध्ये वर्तमान आयटम धारण करणारा “आयटम” नावाचा व्हेरिएबल घोषित करण्यासाठी let हा कीवर्ड वापरला जातो.
4. let हा शब्द “i” नावाचा व्हेरिएबल घोषित करण्यासाठी देखील वापरला जातो जो लूपच्या पुनरावृत्तीमध्ये वर्तमान आयटमचा निर्देशांक ठेवतो.
5. ही ओळ सूचीतील प्रत्येक आयटम त्याच्या अनुक्रमणिका क्रमांकासह (0 पासून सुरू होणारी) प्रदर्शित करते.

अँगुलर म्हणजे काय

अँगुलर हे जावास्क्रिप्ट-आधारित ओपन-सोर्स फ्रंट-एंड वेब ऍप्लिकेशन फ्रेमवर्क आहे जे मुख्यतः Google आणि व्यक्ती आणि कॉर्पोरेशनच्या समुदायाद्वारे एकल-पृष्ठ ऍप्लिकेशन्स विकसित करताना आलेल्या अनेक आव्हानांना तोंड देण्यासाठी राखले जाते. JavaScript घटक Apache Cordova ला पूरक आहेत, क्रॉस-प्लॅटफॉर्म मोबाइल अॅप्स विकसित करण्यासाठी वापरले जाणारे फ्रेमवर्क. क्लायंट-साइड मॉडेल-व्ह्यू-कंट्रोलर (MVC) आणि मॉडेल-व्ह्यू-व्ह्यू-मॉडेल (MVVM) आर्किटेक्चरसाठी सामान्यतः रिच इंटरनेट ऍप्लिकेशन्समध्ये वापरल्या जाणार्‍या घटकांसह फ्रेमवर्क प्रदान करून अशा ऍप्लिकेशन्सचा विकास आणि चाचणी दोन्ही सुलभ करणे हे त्याचे उद्दिष्ट आहे.

ng घटकासाठी

NgFor एक अँगुलर स्ट्रक्चरल डायरेक्टिव्ह आहे जो आम्हाला डेटा लूप करण्यास आणि अॅरे किंवा ऑब्जेक्टमधील प्रत्येक आयटमसाठी टेम्पलेट तयार करण्यास अनुमती देतो. हे दिलेल्या एचटीएमएल घटकाची ठराविक वेळा पुनरावृत्ती करण्यासाठी वापरले जाते. NgFor चा वापर अॅरे, ऑब्जेक्ट किंवा स्ट्रिंगमधील डेटा प्रदर्शित करण्यासाठी केला जाऊ शकतो. हे अॅरे किंवा ऑब्जेक्टच्या मूल्यांवर आधारित HTML घटक तयार करण्यासाठी देखील वापरले जाऊ शकते. NgFor चा वापर सामान्यत: ngIf आणि ngSwitch सारख्या इतर कोनीय निर्देशांच्या संयोजनात केला जातो.

ngFor घटकाची अनुक्रमणिका कशी मिळवायची

ngFor लूपमध्ये घटकाची अनुक्रमणिका मिळविण्यासाठी तुम्ही इंडेक्स कीवर्ड वापरू शकता. यासाठी वाक्यरचना खालीलप्रमाणे आहे.

{{i}} – {{item}}

या उदाहरणात, “i” व्हेरिएबलमध्ये लूपचा वर्तमान निर्देशांक असेल. त्यानंतर तुम्ही तुमच्या सूचीमधील घटकांमध्ये प्रवेश करण्यासाठी किंवा सुधारण्यासाठी हे व्हेरिएबल वापरू शकता.

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

एक टिप्पणी द्या