AngularJS textareaनिर्देश


उदाहरण

डेटा-बाइंडिंग वाला एक टेक्स्टरेरा:

<textarea ng-model="myTextarea"></textarea>

<p>The value of the textarea field is:</p>
<h1>{{myTextarea}}</h1>

परिभाषा और उपयोग

AngularJS <textarea>तत्वों के डिफ़ॉल्ट व्यवहार को संशोधित करता है, लेकिन केवल तभी जब ng-modelविशेषता मौजूद हो।

वे डेटा-बाइंडिंग प्रदान करते हैं, जिसका अर्थ है कि वे एंगुलरजेएस मॉडल का हिस्सा हैं, और इन्हें एंगुलरजेएस फ़ंक्शंस और डीओएम दोनों में संदर्भित और अपडेट किया जा सकता है।

वे सत्यापन प्रदान करते हैं। उदाहरण: एक विशेषता वाला एक <textarea>तत्व , जब तक यह खाली रहता है , तब तक राज्य सेट होता है।required$validfalse

वे राज्य नियंत्रण भी प्रदान करते हैं। AngularJS सभी टेक्स्टरेरा तत्वों की वर्तमान स्थिति रखता है।

Textarea फ़ील्ड में निम्नलिखित अवस्थाएँ होती हैं:

  • $untouched मैदान को अभी तक छुआ नहीं गया है
  • $touched मैदान को छुआ गया है
  • $pristine फ़ील्ड को अभी तक संशोधित नहीं किया गया है
  • $dirty क्षेत्र को संशोधित किया गया है
  • $invalid फ़ील्ड सामग्री मान्य नहीं है
  • $valid फ़ील्ड सामग्री मान्य है

प्रत्येक राज्य का मान एक बूलियन मान का प्रतिनिधित्व करता है, और इनमें true से कोई एक है false


वाक्य - विन्यास

<textarea ng-model="name"></textarea>

ng-modelविशेषता के मूल्य का उपयोग करके टेक्स्टरेरा तत्वों को संदर्भित किया जा रहा है ।



सीएसएस कक्षाएं

<textarea>एंगुलरजेएस एप्लिकेशन के अंदर के तत्वों को कुछ वर्ग दिए गए हैं । इन वर्गों का उपयोग टेक्स्टरेरा तत्वों को उनके राज्य के अनुसार स्टाइल करने के लिए किया जा सकता है।

निम्नलिखित वर्ग जोड़े गए हैं:

  • ng-untouched मैदान को अभी तक छुआ नहीं गया है
  • ng-touched मैदान को छुआ गया है
  • ng-pristine फ़ील्ड को अभी तक संशोधित नहीं किया गया है
  • ng-dirty क्षेत्र को संशोधित किया गया है
  • ng-valid फ़ील्ड सामग्री मान्य है
  • ng-invalid फ़ील्ड सामग्री मान्य नहीं है
  • ng-valid-keyप्रत्येक सत्यापन के लिए एक कुंजी । उदाहरण: ng-valid-required, उपयोगी जब एक से अधिक चीजें हैं जिन्हें सत्यापित किया जाना चाहिए
  • ng-invalid-key उदाहरण: ng-invalid-required

वर्गों को हटा दिया जाता है यदि वे जिस मूल्य का प्रतिनिधित्व करते हैं वह है false

उदाहरण

मानक CSS का उपयोग करके मान्य और अमान्य टेक्स्टरेरा तत्वों के लिए शैलियाँ लागू करें:

<style>
textarea.ng-invalid {
    background-color: pink;
}
textarea.ng-valid {
    background-color: lightgreen;
}
</style>