AngularJS form ইনস্ট্রাকশন

বিবরণ ও ব্যবহার

AngularJS পরিবর্তন <form> এলিমেন্টের ডিফল্ট আচরণ

AngularJS অ্যাপ্লিকেশনের মধ্যে ফর্মকে কিছু বৈশিষ্ট্য দেওয়া হয়। এই বৈশিষ্ট্যগুলি ফর্মের বর্তমান অবস্থা বর্ণনা করে

ফর্মটির একটি বিশেষ অবস্থা হল:

  • $pristine কোনও ফিল্ডকেই পরিবর্তিত করা হয়নি
  • $dirty একটি বা একাধিক ফিল্ড পরিবর্তিত হয়েছে
  • $invalid ফর্মের কনটেন্ট অসম্পূর্ণ
  • $valid ফর্মের কনটেন্ট সম্পূর্ণ
  • $subscribed ফর্ম জমা দেওয়া হয়েছে

প্রত্যেক অবস্থার মান একটি বুল মান হিসাবে প্রতিনিধিত করে, যার মান true বা false.

যদি action এটা নির্দিষ্ট না হয়, তবে AngularJS-এর ফর্ম ডিফল্ট অপারেশনকে প্রতিহত করবে, যা ফর্মকে সার্ভারে জমা দেওয়ার জন্য

প্রতিদর্শন

উদাহরণ 1

যদি প্রয়োজনীয় ইনপুট ফিল্ড খালি থাকে, তবে এই ফর্মের 'বৈধতা অবস্থা' 'true' হিসাবে বিবেচিত হবে না:

<form name="myForm">
<input name="myInput" ng-model="myInput" required>
</form>
<p>ফর্মের বৈধতা অবস্থা হল:</p>
<h1>{{myForm.$valid}}</h1>

স্বয়ং প্রয়াস করুন

উদাহরণ 2

স্টাইল অ্যাপ্লাই করুন যাতে পরিবর্তিত না হওয়া (মূল) ফর্ম এবং পরিবর্তিত ফর্ম

<style>
form.ng-pristine {
    background-color: lightblue;
}
form.ng-dirty {
    background-color: pink;
}
</style>

স্বয়ং প্রয়াস করুন

গঠনশৈলী

<form name="formname</form>

নিম্নোক্ত দ্বারা ব্যবহার করা হয় নাম প্রতীক্ষা করে ফর্মকে উল্লেখ করা হয়

CSS ক্লাস

AngularJS অ্যাপ্লিকেশনের ভিতরের ফর্মকে কিছু ক্লাস দেওয়া হয়েছে। এই ক্লাসগুলি ফর্মের অবস্থানুসারে ফর্মের স্টাইল সেট করার জন্য ব্যবহৃত হয়

নিম্নলিখিত ক্লাস যোগ করা হয়েছে:

  • ng-pristine কোনও ফিল্ড পরিবর্তিত হয়নি
  • ng-dirty একটি বা একাধিক ফিল্ড পরিবর্তিত হয়েছে
  • ng-valid ফর্মের কনটেন্ট সম্পূর্ণ
  • ng-invalid ফর্মের কনটেন্ট অসম্পূর্ণ
  • ng-valid-key প্রত্যেকবার একটি কোনও কীয়ার পরীক্ষা করা হয়। উদাহরণ:ng-valid-requiredএকটি বহুবচনা কোনও প্রতিক্রিয়ায় অবশ্যই পরীক্ষা করতে অত্যন্ত উপযোগী
  • ng-invalid-key উদাহরণ:ng-invalid-required

যদি ক্লাসের মান একটি মানের প্রতিনিধিত্ব করে falseযদি ক্লাসের মান মুক্ত থাকে, তবে এই ক্লাসগুলি মুক্তি দেওয়া হবে。