टेम्पलेट-आधारित फ़ॉर्म
टेम्पलेट-आधारित विधियों का उपयोग करके शीघ्रता से फ़ॉर्म बनाएँ।
टेम्पलेट-आधारित फ़ॉर्म, CoddyKit पर Angular Academy का एक निःशुल्क पाठ है। यह 3 में से 1वाँ पाठ है। इस अध्ययन पथ के 3 तक कोई भी पाठ पूरा पढ़ना निःशुल्क है — इसके बाद CoddyKit PRO हर पाठ अनलॉक करता है, साथ ही अंतर्निर्मित कोड संपादक और चौबीसों घंटे एआई शिक्षक के साथ व्यावहारिक अभ्यास भी उपलब्ध कराता है। यह Angular Academy सीखने के मार्ग का हिस्सा है और आपकी प्रगति वेब तथा CoddyKit ऐप पर सिंक होती रहती है। Angular Academy पाठ्यक्रम में कुल 3 पाठ शामिल हैं।
टेम्पलेट-आधारित फ़ॉर्म
इस पाठ में आपको Angular के टेम्पलेट-आधारित फ़ॉर्म से परिचित कराया जाएगा, जिनकी सहायता से आप सरल फ़ॉर्म जल्दी बना सकते हैं।
टेम्पलेट-आधारित फ़ॉर्म क्या हैं?
टेम्पलेट-आधारित फ़ॉर्म फ़ॉर्म बनाना, सत्यापन और सबमिशन आसानी से संभालने के लिए HTML टेम्पलेट और Angular निर्देशों का उपयोग करते हैं।
FormsModule इम्पोर्ट करना
टेम्पलेट-आधारित फ़ॉर्म का उपयोग करने के लिए अपने Angular मॉड्यूल में FormsModule इम्पोर्ट करें:
import { FormsModule } from '@angular/forms';सरल फ़ॉर्म बनाना
ngForm निर्देश का उपयोग करके अपने टेम्पलेट में एक सरल फ़ॉर्म परिभाषित करें:
<form #form="ngForm">
<input name="username" ngModel>
</form>ngModel के साथ दो-तरफ़ा बाइंडिंग
ngModel दो-तरफ़ा डेटा बाइंडिंग का उपयोग करके फ़ॉर्म नियंत्रणों को घटक के गुणों से जोड़ता है:
<input [(ngModel)]="user.name" name="username">फ़ॉर्म सबमिशन
Angular की इवेंट बाइंडिंग का उपयोग करके फ़ॉर्म सबमिशन आसानी से संभालें:
<form (ngSubmit)="onSubmit(form)" #form="ngForm">फ़ॉर्म सत्यापन
Angular required और minlength जैसे आसान सत्यापन निर्देश प्रदान करता है:
<input name="username" ngModel required minlength="4">फ़ॉर्म की स्थिति ऐक्सेस करना
टेम्पलेट वेरिएबल के माध्यम से फ़ॉर्म की स्थिति, जैसे वैधता या स्पर्श की स्थिति, ऐक्सेस करें:
<div *ngIf="form.invalid && form.touched">Form is invalid!</div>सारांश
आपने टेम्पलेट-आधारित फ़ॉर्म से फ़ॉर्म बनाना, बाइंड करना, सत्यापित करना और सबमिट करना आसानी से सीख लिया है। अभ्यास करते रहें!
एआई शिक्षक के साथ HTML सीखें — निःशुल्क
अपने ब्राउज़र में वास्तविक कोड लिखें और चलाएँ, चौबीसों घंटे एआई शिक्षक से तुरंत सहायता पाएँ, और वेब या ऐप पर वहीं से शुरू करें जहाँ आपने छोड़ा था।
- पाठ्यक्रम
- 38
- पाठ
- 144
अक्सर पूछे जाने वाले प्रश्न
क्या “टेम्पलेट-आधारित फ़ॉर्म” पाठ निःशुल्क है?
हाँ — Angular Academy अध्ययन पथ के 3 तक कोई भी पाठ, जिसमें “टेम्पलेट-आधारित फ़ॉर्म” भी शामिल है, यहाँ वेब पर पूरा पढ़ना निःशुल्क है। इसके बाद CoddyKit PRO हर पाठ अनलॉक करता है, साथ ही अंतर्निर्मित कोड संपादक और चौबीसों घंटे एआई शिक्षक के साथ इंटरैक्टिव अभ्यास भी उपलब्ध कराता है। Angular Academy पाठ्यक्रम में कुल 3 पाठ शामिल हैं।
“टेम्पलेट-आधारित फ़ॉर्म” में मैं क्या सीखूँगा?
टेम्पलेट-आधारित विधियों का उपयोग करके शीघ्रता से फ़ॉर्म बनाएँ। आप ब्राउज़र में सीधे चलाए जाने वाले व्यावहारिक कोड के साथ Angular Academy का अभ्यास करते हैं, और पाठ पूरा करते समय 24/7 एआई ट्यूटर आपके प्रश्नों के उत्तर देता है।
क्या Angular Academy शुरू करने के लिए मुझे किसी अनुभव की आवश्यकता है?
पहले के अनुभव की आवश्यकता नहीं है। CoddyKit पर Angular Academy शुरुआती से लेकर उन्नत शिक्षार्थियों तक सभी के लिए व्यवस्थित किया गया है, इसलिए आप यहीं से या शुरुआत से सीखना शुरू कर सकते हैं और अपनी गति से आगे बढ़ सकते हैं। यह 3 में से 1वाँ पाठ है।
“टेम्पलेट-आधारित फ़ॉर्म” पाठ पूरा करने में कितना समय लगता है?
CoddyKit का अधिकांश पाठ लगभग 5–10 मिनट में पूरा हो जाता है। हर पाठ छोटा और संवादात्मक है, इसलिए आप लगातार प्रगति करते हैं और वेब या ऐप पर वहीं से सीखना जारी रख सकते हैं जहाँ आपने छोड़ा था।
क्या मैं इस Angular Academy पाठ में कोड लिख और चला सकता हूँ?
हाँ। हर Angular Academy पाठ में एक अंतर्निर्मित कोड संपादक शामिल है, जिससे आप सीधे अपने ब्राउज़र में वास्तविक कोड लिख और चला सकते हैं और तुरंत एआई प्रतिक्रिया पा सकते हैं—स्थानीय सेटअप की आवश्यकता नहीं है।
इस पाठ्यक्रम के सभी पाठ
- टेम्पलेट-आधारित फ़ॉर्म
- रिएक्टिव फ़ॉर्म
- कस्टम वैधीकरण