قسمت سیزدهم AngularJS: لیست کشویی در انگولار چگونه تعریف می‌شوند؟

Share on facebook
Share on twitter
Share on linkedin
Share on email
Share on whatsapp
Share on telegram
Share on print
قسمت سیزدهم AngularJS : لیست کشویی در انگولار چگونه تعریف میشوند ؟

نویسنده:

مرتضی افضلی

Statistics-rafiki

تعداد بازدید:

1300

Calendar-amico (2)

تاریخ انتشار:

7 , فروردین , 1398

Work time-rafiki

زمان تقریبی مطالعه :

5 دقیقه

انگولار جی اس به شما این اجازه را می‌دهد تا به‌سادگی دران به‌وسیله‌ی آرایه‌ها و یا شی‌ءها لیست کشویی تولید کنید.
پیشنهاد میشود قبل از ورود به این اموزش سایر قسمت های اموزشی دوره ی انگولار جی اس را مطالعه فرمایید.

ساخت لیست انتخابی به‌وسیله ng-options

اگر شما قصد داشته باشید لیست کشویی بر پایه آرایه‌ها و یا شی‌ءها در انگولار تولید کنید باید از دستورالعمل ng-options استفاده کنید. شما می‌توانید برای درک بهتر استفاده از دستورالعمل‌ها بر روی دستورالعمل انگولار کلیک کنید تا وارد آموزش مربوطه شوید.
به مثال زیر درباره‌ی ساخت لیست انتخابی توجه کنید:

مقایسه‌ی ng-options و ng-repeat

شما به‌سادگی می‌توانید با استفاده از دستورالعمل ng-repeat نیز لیست کشویی مانند قبل ایجاد کنید.

شما به‌سادگی با دستورالعمل ng-repeat به دلیل تکرار بلاک‌های کد html در هر خانه از ارائه می‌توانید خانه‌هایی در لیست کشویی ایجاد کنید، اما دستورالعمل ng-options فقط برای پر کردن خانه‌های لیست کشویی طراحی‌شده است و در انتها یک خصوصیت بسیار ویژه‌تر نسبت به دستورالعمل ng-repeat دارد:

لیست‌های کشویی که به‌وسیله‌ی ng-options ساخته می‌شوند اجازه انتخاب مقداری از شیءها به شما می‌دهد درصورتی‌که در ng-repeat شما فقط اجازه انتخاب یک رشته رادارید.

چه استفاده کنیم ؟

هنگامی‌که شما یک رشته از شی‌ءها مانند لیست زیر دارید:

دستورالعمل ng-repeat دارای محدودیت انتخاب یک رشته به‌عنوان مقدار می‌باشد:

در حال که دستورالعمل ng-option محدودیتی برای انتخاب ندارد و تمامی شی‌ءها را می‌پذیرد.

هنگامی‌که شما بتوانید یکشی را به‌عنوان مقدار بپذیرید قطعاً می‌توانید اطلاعات بیشتری استفاده کنید و اپلیکیشن شما قابل‌انعطاف خواهد شد. به همین دلیل ما در این آموزش از دستورالعمل ng-options استفاده می‌کنیم.

منبع داده به عنوان یک شی

در مثال‌های قبل ما از آرایه‌ها به‌عنوان منبع داده استفاده می‌کردیم اما می‌توان از شیءها نیز به‌عنوان منبع داده استفاده کرد.
فرض کنید شما نیز یک شیء باارزش کلیدی و مشترک دارید:

استفاده از اصلاحات در دستورالعمل ng-options مقداری برای شیءها متفاوت است:

در استفاده از شیءها به‌عنوان منبع داده، x مقدار کلیدی و y مقدار ارزشی را تکرار خواهد کرد. برای درک بهتر این موضوع به مثال زیر توجه کنید:

مقدار انتخاب‌شده همیشه به‌عنوان value در key-value شناخته می‌شود.
Value در key-value نیز می‌تواند یک شیء باشد.
مقدار انتخاب‌شده همیشه به‌عنوان value در key-value شناخته می‌شود، با این تفاوت که این بار از شیء استفاده کردیم:

خانه‌های لیست کشویی نباید از جنس key در key-value باشند، فقط می‌توانند value یا خاصیتی از شیء value باشند
برای درک بهتر این موضوع به مثال زیر توجه کنید :

امیدوارم این آموزش هم برای شما عزیزان مفید واقع‌شده باشد.
برای خواندن مطالب بیشتر دراین‌باره می‌توانید به سایت w3schools مراجعه فرمایید.
پیروز باشید.

مرتضی افضلی

مرتضی افضلی

این روزها دیگر نیاز نیست کلی هزینه‌ی اجاره‌ی مغازه بدهید. با دنیای کسب‌وکار اینترنتی و دیجیتال مارکتینگ می‌توانیم کسب درامد داشته باشیم و من در مجموعه‌ی کدپز در این راه همراه شما هستم.

تا کنون 56 نفر در کدپز ثبت نام کرده اند.

0 پاسخ به "قسمت سیزدهم AngularJS: لیست کشویی در انگولار چگونه تعریف می‌شوند؟"

ارسال یک پیام

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *

X