فهرست مستندات پروژه
انواع انتخابگر و قالب خروجی
انتخاب حالت مناسب و آشنایی با مقدار رشتهای و ساختاریافته هر نوع.
انواع انتخابگر
برای نمونههای میلادی این صفحه، intl-datepicker را وارد کنید. پیش از تنظیم مقدار، type را مشخص کنید. اگر نوع تعیین نشده یا ناشناخته باشد، date استفاده میشود؛ نوع ناشناخته هشدار هم ایجاد میکند.
| نوع | نمونه value غیرخالی | معنی |
|---|---|---|
date | 2026-03-15 | یک روز میلادی |
range | 2026-03-15/2026-03-20 | شروع و پایان مرتبشده؛ شروع بدون پایان به شکل 2026-03-15 است |
week | 2026-W11 | شناسه هفته ISO؛ مرز انتخاب از قواعد هفته پیروی میکند |
multiple | 2026-03-15,2026-03-18 | روزهای میلادی جداشده با ویرگول |
month | 2026-03 | ماه میلادی |
year | 2026 | سال میلادی |
در همه نوعها، نبود انتخاب با '' نمایش داده میشود. خروجی روز، بازه، هفته و چند روز، مستقل از تقویم نمایشی، میلادی یا ISO است. قالب ماه و سال غیرمیلادی در ادامه آمده است.
روز و بازه
<intl-datepicker value="2026-03-15"></intl-datepicker>
<intl-datepicker type="range" value="2026-03-15/2026-03-20"></intl-datepicker>
در بازه، کلیک اول شروع را انتخاب میکند و کلیک دوم بازه را کامل میکند. اگر پایان زودتر از شروع باشد، دو سر بازه مرتب میشوند. انتخاب بعدی، بازه تازهای را آغاز میکند. اگر بازه همروز مجاز نباشد، کلیک دوباره روی شروع در انتظار، آن را پاک میکند. برای نامعتبر بودن بازه بدون پایان، required بگذارید. طول بازه اختلاف پایان و شروع بر حسب شب است؛ این نمونه ۵ شب دارد. قواعد بازه را ببینید.
هفته
<intl-datepicker type="week" locale="en-GB" first-day-of-week="mon"
value="2026-W11" show-week-numbers></intl-datepicker>
در این نمونه rangeStart برابر 2026-03-09 و rangeEnd برابر 2026-03-15 است. مقدار خروجی، هفته ISO شامل پنجشنبه بازه انتخابی را مشخص میکند. مرز هفته از first-day-of-week و در نبود آن از زبان و منطقه پیروی میکند. برای مرزهای میلادی، rangeStart و rangeEnd را بخوانید؛ شیءهای start و end رویداد به تقویم فعال تعلق دارند. پس تغییر قواعد هفته میتواند روزهای بازه را تغییر دهد.
یک روز ISO ساده هم پذیرفته میشود و هفته محلی شامل آن را انتخاب میکند. مقدار هفته در min و max به کل همان هفته گسترش مییابد، اما حدی که روز ISO باشد دقیق باقی میماند. شماره هفته در جدول از قواعد محلی پیروی میکند و لزوما با شماره ISO در value برابر نیست.
حالت هفته، مجاز بودن روز کلیکشده را بررسی میکند و سپس کل هفته را انتخاب میکند. لازم نیست همه روزهای آن هفته در دسترس باشند. هفتهای که از حد روزانه min یا max عبور کند ممکن است انتخاب شود و سپس در اعتبارسنجی نامعتبر باشد. برای بررسی ظرفیت رزرو، از range با قواعد مشخص استفاده کنید.
چند روز
<intl-datepicker type="multiple" max-dates="3" sort-dates
value="2026-03-18,2026-03-15" date-separator=" | "></intl-datepicker>
مقدار نهایی 2026-03-15,2026-03-18 است. date-separator فقط متن نمایشی را تغییر میدهد. کلیک روی روز، آن را اضافه یا حذف میکند و پنجره باز میماند. روزی که قبلا انتخاب شده، حتی اگر بعدا غیرفعال شود، قابل حذف است.
در فهرست تنظیمشده با کد، تاریخهای تکراری حذف و ورودیهای نامعتبر کنار گذاشته میشوند. با max-dates، ابتدا تعداد مجاز از تاریخهای معتبر و یکتا نگه داشته میشود و سپس مرتبسازی انجام میشود. کم کردن max-dates پس از انتخاب، فهرست فعلی را فوری کوتاه نمیکند. selectedDates شامل شیءهای CalendarDate در تقویم فعال است؛ آن را فقط برای خواندن به کار ببرید.
ماه و سال
<intl-datepicker type="month" value="2026-03"></intl-datepicker>
<intl-datepicker type="year" value="2026"></intl-datepicker>
این نوعها مستقیم در نمای ماه یا سال باز میشوند. در وضعیت داخلی، دوره انتخابی با روز اول آن نمایش داده میشود. getValue() علاوه بر مقدار، رشتههای میلادی start و end را برای اولین و آخرین روز دوره برمیگرداند. قواعد غیرفعال کردن روز، کل ماه یا سال را غیرفعال نمیکنند؛ از حد دوره و اعتبارسنجی برنامه استفاده کنید.
برای تقویم غیرمیلادی، ابتدا ماژول تقویم را وارد کنید:
import 'intl-datepicker/calendars/persian';
import 'intl-datepicker/labels/fa';
import 'intl-datepicker';
<intl-datepicker type="month" calendar="persian" locale="fa-IR"
value="2024-07-22[u-ca=persian]"></intl-datepicker>
<intl-datepicker type="year" calendar="persian" locale="fa-IR"
value="2024-03-20[u-ca=persian]"></intl-datepicker>
نمونه اول مرداد ۱۴۰۳ را با مرزهای 2024-07-22 تا 2024-08-21 انتخاب میکند. نمونه دوم سال ۱۴۰۳ را با مرزهای 2024-03-20 تا 2025-03-20 انتخاب میکند. این رشتهها از روز اول میلادی دوره و پسوند [u-ca=...] ساخته میشوند. قالب کوتاه 1403-05 یا 1403 برای انتخابگر ماه و سال شمسی پذیرفته نمیشود.
با دادن هر روز ISO ساده، دوره شامل آن انتخاب میشود. مثلا تنظیم انتخابگر ماه شمسی روی 2024-08-10 مقدار 2024-07-22[u-ca=persian] را میدهد. این تبدیل به شروع دوره برای min و max ماه و سال هم انجام میشود. پسوند تقویم، تقویم فعال را عوض نمیکند؛ تفسیر مقدار به calendar وابسته است. نام جایگزین islamic در خروجی با پسوند islamic-umalqura نوشته میشود.
در تقویم ژاپنی، جابهجایی سال بر اساس سال میلادی انجام میشود و عنوانها نام دوره را نشان میدهند؛ سال تغییر دوره هر دو نام را دارد. شیءهای رویداد فقط عدد سال، ماه و روز دارند و فیلد دوره ندارند. برای ذخیره تاریخهایی که دوره ژاپنی در آنها مهم است، از مقدارها و مرزهای ISO استفاده کنید.