مرجع API

إليك العقد الكامل لـ calendar: كل ما يمكنك ربطه والاستماع إليه وإسقاطه وتنسيقه، مجموعاً في مكان واحد. اربط ما تحتاجه ونسّق ما تريده — إنه standalone وملائم للـ Signals.

المدخلات

اضبط calendar عبر 6 مدخلات. اربطها مثل أي @Input في Angular.

الاسم	النوع	الافتراضي	الوصف
`events`	`CalendarEvent<T>[]`	`[]`	مصفوفة الأحداث لعرضها على التقويم
`view`	`'month' \| 'week' \| 'day' \| 'year'`	`'month'`	نوع العرض الحالي (ربط ثنائي الاتجاه مع viewChange)
`selectedDate`	`Date`	`new Date()`	التاريخ المركَّز عليه حاليًا (ربط ثنائي الاتجاه مع dateChange)
`config`	`CalendarConfig`	`{}`	خيارات الإعداد للتقويم
`eventClass`	`string \| ((event: CalendarEvent) => string)`	`undefined`	فئة (فئات) CSS لتطبيقها على الأحداث، يمكن أن تكون ثابتة أو ديناميكية
`weekStartsOn`	`0 \| 1 \| 2 \| 3 \| 4 \| 5 \| 6`	`0`	اليوم الذي يبدأ به الأسبوع (0 = الأحد، 1 = الاثنين، إلخ.)

المخرجات

تفاعل مع ما يفعله calendar — 5 أحداث لربط منطقك بها.

الاسم	النوع	الوصف
`eventClick`	`CalendarEvent<T>`	يُطلَق عند النقر على حدث
`dayClick`	`CalendarDay<T>`	يُطلَق عند النقر على خلية يوم
`eventDrop`	`{ event: CalendarEvent<T>; newDate: Date; previousDate: Date }`	يُطلَق عند إفلات حدث في يوم مختلف
`viewChange`	`CalendarViewType`	يُطلَق عند تغيّر نوع العرض
`dateChange`	`Date`	يُطلَق عندما يغيّر التنقل التاريخ المعروض

القوالب

اجعله خاصاً بك — 2 فتحات قوالب تتيح لك إسقاط ترميز مخصّص.

الاسم	الوصف	مثال
`eventTpt`	قالب لعرض الأحداث الفردية. السياق: { event: CalendarEvent }	`<ng-template eventTpt let-event="event">{{ event.title }}</ng-template>`
`dayCellTpt`	قالب لتخصيص عرض خلية اليوم. السياق: { day: CalendarDay }	`<ng-template dayCellTpt let-day="day">{{ day.date \| date }}</ng-template>`

متغيّرات CSS

لم يتم توثيق أي متغيّرات CSS بعد.

التنسيق والسمات

لم يتم توثيق أي أمثلة تنسيق بعد. سيتضمّن هذا القسم وصفات التخصيص وأمثلة السمات.