آموزشگاه برنامه نویسی تحلیل داده
آموزشگاه برنامه نویسی تحلیل داده

آموزش KnockoutJS-آموزش selectedOptions binding در KnockoutJS

دوره های مرتبط با این مقاله

آموزش KnockoutJS-آموزش selectedOptions binding در KnockoutJS

selectedOptions binding کنترل می کند که کدام المان ها در یک لیست چند انتخابی در حال حاضر انتخاب شده اند. این binding قرار است که در کنار المان < select > و options binding استفاده شود.
هنگامی که کاربر در این لیست چند انتخابی آیتمی را انتخاب می کند یا از حالت انتخاب در می آورد، مقدار متناظر به آرایه ای در view model شما اضافه شده و یا از آن حذف می شود. همچنین با این فرض که این آرایه قابل مشاهده باشد، هر زمان که شما آیتم هایی را به این آرایه (مثلا از طریق push یا splice) اضافه کنید یا از آن حذف کنید، در اینصورت آیتم های متناظر موجود در رابط کاربری انتخاب شده و یا از حالت انتخاب در می آیند. این binding یک binding دو طرفه است.

نکته:

برای اینکه کنترل کنید که چه المانی در drop-down لیست تک انتخابی انتخاب شده است، می توانید به جای selectedOptions binding از valuebinding استفاده کنید.

مثال

<  p >
    Choose some countries you'd like to visit: 
    < select data-bind="options: availableCountries, selectedOptions: chosenCountries" size="5" multiple="true" >< /select >
< /p >
 
< script type="text/javascript" >
    var viewModel = {
        availableCountries : ko.observableArray(['France', 'Germany', 'Spain']),
        chosenCountries : ko.observableArray(['Germany']) // Initially, only Germany is selected
    };
     
    // ... then later ...
    viewModel.chosenCountries.push('France'); // Now France is selected too
< /script >

پارامترها

  • پارامتر اصلی
    • پارامتر اصلی باید یک آرایه یا یک آرایه ی قابل مشاهده باشد. KnockoutJS option های انتخاب شده ی المان را به گونه ای تنظیم می کند که بر محتواهای آرایه منطبق شود. تمامی حالت های انتخابی گذشته overwrite خواهند شد.
      اگر پارامتر شما یک آرایه ی قابل مشاهده باشد، در این صورت این binding هر زمان که این آرایه تغییر میکند، حالت انتخابی المان را آپدیت می کند (مثلا از طریق push ، pop یا دیگر متدهای آرایه های قابل مشاهده). در صورتی که پارامتر قابل مشاهده نباشد، این binding حالت انتخابی المان را تنها یک بار تنظیم می کند و دیگر آن را در آینده آپدیت نخواهد کرد.
      چه پارامترتان آرایه ی قابل مشاهده باشد چه نباشد، KnockoutJS تشخیص می دهد که چه زمانی کاربر آیتمی را در لیست چند انتخابی، انتخاب می کند یا از حالت انتخاب در می آورد، و بعد برای تطبیق دهی آرایه را آپدیت می کند. به همین روش می توانید بخوانید که کدام یک از option ها انتخاب شده اند.
  • پارامتر اضافی
    • ندارد

آموزش KnockoutJS-آموزش فراهم کردن امکان انتخاب از شیء های قراردادی جاوا اسکریپت برای کاربر

در مثال بالا کاربر می تواند از آرایه ای از مقادیر رشته ای گزینه ای را انتخاب کند. لزومی ندارد که حتما و تنها از رشته ها استفاده کنید. (آرایه ی option شما در صورت تمایل می تواند شامل اشیاء قراردادی جاوا اسکریپت باشد). برای اینکه بدانید چگونه نمایش دادن اشیاء قراردادی در لیست را کنترل کنید به options binding مراجعه کنید.
در این حالت مقادیری که شما با استفاده از selectedOptions می نویسید و میخوانید خود آن شیء ها هستند، نه ارائه ی متنی آن ها (textual representations). این باعث می شود که در بیشتر موارد کدتان خلوت تر و زیباتر شود. View model شما بدون اینکه نیاز باشد که بداند چگونه این اشیاء در یک ارائه ی on-screen ترسیم شده اند، این فرض را می کند که کاربر از داخل آرایه ای از اشیاء قراردادی به انتخاب می پردازد.

وابستگی ها

به غیر از کتابخانه ی اصلی KnockoutJS، وابستگی دیگری ندارد.

Angular 6 کلیک نمایید .

  • 117
  •    164
  • تاریخ ارسال :   1397/05/22

دانلود PDF دانشجویان گرامی اگر این مطلب برای شما مفید بود لطفا ما را در GooglePlus محبوب کنید
رمز عبور: tahlildadeh.com یا www.tahlildadeh.com
ارسال دیدگاه نظرات کاربران
شماره موبایل دیدگاه
عنوان پست الکترونیک

ارسال

آموزشگاه برنامه نویسی تحلیل داده
آموزشگاه برنامه نویسی تحلیل داده

تمامی حقوق این سایت متعلق به آموزشگاه تحلیل داده می باشد .