آموزش Angular Intermediate: چگونه یک Angular Datepicker بسازیم

سرفصل ها و درس ها

یک مؤلفه تقویم قابل استفاده مجدد بسازید Build a Reusable Calendar Component

• بررسی اجمالی Overview

• معرفی Introduction

• کنترل های اصلی تقویم Basic Calendar Controls

• اجزای کنترل شده در مقابل اجزای کنترل نشده Controlled vs Uncontrolled Components

• مؤلفه های کتابخانه-آگنوستیک Library-Agnostic Components

• تقویم با پارامترهای URL Calendars with URL Parameters

• نتیجه Conclusion

با Dates در Angular کار کنید Work with Dates in Angular

• بررسی اجمالی Overview

• معرفی Introduction

• استراتژی اجرای اصلی تقویم Basic Calendar Implementation Strategy

• مقدمه ای بر کتابخانه لحظه Introduction to the Moment Library

• پیاده سازی اصلی تقویم Basic Calendar Implementation

• نتیجه Conclusion

ساخت ردیاب رویداد زاویه ای: اصول Build an Angular Event Tracker: The Basics

• بررسی اجمالی Overview

• معرفی Introduction

• استراتژی اجرای رویداد-ردیاب Event-Tracker Implementation Strategy

• یک مدل زاویه ای "وانیلی" ایجاد کنید Create a "Vanilla" Angular Modal

• یک فرم رویداد جدید بسازید Build a New Event Form

• نمایش و پنهان کردن مدال ها Show and Hide Modals

• نتیجه Conclusion

ساخت یک ردیاب رویداد زاویه ای: استایل و دکوراسیون تقویم Build an Angular Event Tracker: Calendar Styling & Decoration

• بررسی اجمالی Overview

• معرفی Introduction

• یک ظاهر طراحی اولیه تقویم Basic Calendar Styling

• استایل جدید فرم رویداد New Event Form Styling

• ایجاد رویدادهای جدید Create New Events

• نمایش رویدادها در سلول های تقویم Display Events in Calendar Cells

• نتیجه Conclusion

یک انتخابگر تاریخ تکی در Angular بسازید Build a Single-Date Date-Picker in Angular

• بررسی اجمالی Overview

• معرفی Introduction

• مبانی انتخابگر تاریخ Date-Picker Basics

• یک کامپوننت کشویی ایجاد کنید Create a Dropdown Component

• نمایش یک تقویم در داخل یک کشویی Display a Calendar Inside a Dropdown

• اجرای انتخاب تاریخ Implement Date Selection

• نتیجه Conclusion

در Angular یک Date-Range Date-Picker بسازید Build a Date-Range Date-Picker in Angular

• بررسی اجمالی Overview

• معرفی Introduction

• تنظیم اولیه محدوده تاریخ Basic Date-Range Setup

• تاریخ شروع و پایان را انتخاب کنید Select Start and End Dates

• نمایش چندین تاریخ انتخاب شده Display Multiple Selected Dates

• In-Between Dates را انتخاب کنید Select In-Between Dates

• نتیجه Conclusion

یک انتخابگر تاریخ چندگانه در Angular بسازید Build a Multi-Date Date-Picker in Angular

• بررسی اجمالی Overview

• معرفی Introduction

• مبانی انتخاب تاریخ چندتایی Multi-Date Date-Picker Basics

• Logic TypeScript Data Picker Multi-Date Multi-Date Date-Picker TypeScript Logic

• تاریخ های انتخاب شده را تغییر دهید Toggle Selected Dates

• کلاس های قرص به سبک را تعریف کنید Define Pill-Style Classes

• بررسی کنید که آیا تاریخ های قبلی و بعدی انتخاب شده اند Check If Previous and Next Dates Are Selected

• نتیجه Conclusion