আমি কীভাবে শর্তাধীনভাবে AngularJS এর ​​সাথে ফর্ম ইনপুটগুলি প্রয়োজন?


234

ধরুন আমরা অ্যাঙ্গুলারজেএস দিয়ে একটি ঠিকানা বই অ্যাপ্লিকেশন (স্বীকৃত উদাহরণ) তৈরি করছি।

আমরা ইমেইল এবং ফোন নম্বর জন্য ইনপুট আছে যা পরিচিতির একটি ফর্ম আছে, এবং আমরা প্রয়োজন করতে চান এক বা অন্যান্য কিন্তু উভয় না , আমরা তো চাই emailইনপুট প্রয়োজন হতে হলে phoneইনপুট বিপরীতভাবে খালি অথবা অবৈধ, এবং ভাইস হয়।

কৌণিকের একটি requiredনির্দেশনা রয়েছে, তবে কীভাবে এটি এই ক্ষেত্রে এটি ব্যবহার করতে হয় তা নথি থেকে পরিষ্কার নয়। সুতরাং আমরা কীভাবে শর্তাধীনভাবে একটি ফর্ম ক্ষেত্রের প্রয়োজন হতে পারি? একটি কাস্টম নির্দেশিকা লিখুন?

উত্তর:


463

কাস্টম নির্দেশিকা লেখার দরকার নেই। কৌণিকের ডকুমেন্টেশন ভাল তবে সম্পূর্ণ নয়। আসলে , একটি নির্দেশিকা বলা হয় ngRequired, এটি একটি কৌণিক অভিব্যক্তি গ্রহণ করে।

<input type='email'
       name='email'
       ng-model='contact.email' 
       placeholder='your@email.com'
       ng-required='!contact.phone' />

<input type='text'
       ng-model='contact.phone'             
       placeholder='(xxx) xxx-xxxx'
       ng-required='!contact.email' />  

এখানে আরও একটি সম্পূর্ণ উদাহরণ: http://jsfiddle.net/uptnx/1/


5
সমস্যা হওয়া উচিত নয়, তাই না? কেবলমাত্র সেই অনুযায়ী শর্তাদি আপডেট করুন। আপনার যদি আরও কিছুটা প্রয়োজন হয় তা যদি আপনি ব্যাখ্যা করেন তবে আমি (বা এখানে অন্য ব্যক্তি) আপনাকে দেখাতে সক্ষম হব :)
পুস

1
পার্শ্ব নোট হিসাবে, আপনি একটি ফাংশন ব্যবহার করতে পারেন এবং সেখানে আরও জটিল যুক্তি করতে পারেন।
লিয়েনড্রো জুব্রেজকি

1
এই বৈশিষ্ট্যটি এখন দ্বারা নথিভুক্ত করা হয়েছে: ডকস.অঙ্গুলারজস.আর.ইপি
ডাইরেক্টিভ

25

অন্য লেখা থাকলে আপনি যদি একটি ইনপুট লাগাতে চান:

   <input type='text'
   name='name'
   ng-model='person.name'/>

   <input type='text'
   ng-model='person.lastname'             
   ng-required='person.name' />  

শুভেচ্ছা।


14

সাধারণ আপনি কৌণিক বৈধতা যেমন ব্যবহার করতে পারেন:

 <input type='text'
   name='name'
   ng-model='person.name'
   ng-required='!person.lastname'/>

   <input type='text'
   name='lastname'
   ng-model='person.lastname'             
   ng-required='!person.name' /> 

আপনি এখন কেবল একটি পাঠ্য ক্ষেত্রে মান পূরণ করতে পারেন। হয় আপনি নাম বা পদবি পূরণ করতে পারেন। এইভাবে আপনি অ্যাংুলারজেগুলিতে শর্তসাপেক্ষে প্রয়োজনীয় ফিল ব্যবহার করতে পারেন।


একটি এখনও উভয় ক্ষেত্র পূরণ করতে পারেন, তারা না?
myTerminal

হ্যাঁ ব্যবহারকারী উভয়
বিপিন শিল্পককর

13

Angular2 এর জন্য

<input type='email' 
    [(ngModel)]='contact.email'
    [required]='!contact.phone' >

সম্পাদনা: এটি একটি কনসোল ত্রুটি ছুঁড়ে দিচ্ছে "এক্সপ্রেশনচেনজডএফটারআইটি হাসবিন চেকড এ্যরার: এক্সপ্রেশন চেক করার পরে এটি পরিবর্তন হয়েছে।" আমি যখন রেডিও বোতামটি চেক করি তখন আমি এটি প্রয়োগ করি তবে এটি শর্তযুক্ত বৈধতা যাচাই করে না।
এরিক সোইকে

4
কৌণিক 2 + এই প্রশ্নের উপর ট্যাগ করা হয় না। যেহেতু এটি মূলত একটি আলাদা কাঠামো, তাই এই উত্তরটি প্রাসঙ্গিক নয়।
ইশারউড

1
@ আইসরউড আপনি ঠিক বলেছেন আমি এটি যুক্ত করেছি কারণ এর জন্য গুগল করার সময় আমি এখানেই শেষ হয়েছি। যদি এটি নিম্নমানযুক্ত বা বিতর্কিত হয়ে যায় তবে আমি এটি মুছে ফেলব।
লাফস্টে

@ আইফাস্তে আপনি এঙ্গুলার 2 + এর জন্য নতুন প্রশ্নের পোস্ট করতে এবং উত্তর দিতে পারেন যাতে লোকেরা এটি দেখার পক্ষে এটি সহজ করে তোলে। +1 যাইহোক =)
আর্জেেল
আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.